I have an igGrid with group by feature enabled. We use unbound columns to paint delete buttons because our users HATE that the OOTB buttons only show on hover. So when a user deletes the last row in a group, the group is still visible but without any records in it. How do we get rid of the group when there aren't any more rows under it?
Preferably without data binding. Otherwise we'll need to keep the current scroll position, group collapse state, etc.
Hello Karthik,
If you need any further assistance, please let me know.
Regards,
Tsanna
That works, thanks!
In order to delete the group row, you should delete it manually, for instance:
function deleteRow(rowId) { var grid = $("#grid").data("igGrid"); var currRow = $("#grid").igGrid("rowById", rowId); if((!currRow.next().length || currRow.next().filter("[data-grouprow='true']").length) && currRow.prev("[data-grouprow='true']").length){ currRow.prev().remove(); } $("#grid").igGridUpdating("deleteRow", rowId); }
Please try this and let me know if it works for you.
Regards,Tsanna
I've modified the sample to reproduce the issue. I turned auto commit on and used the API to delete the record. I also included the Updating feature. Your example is not preferred because the groups collapse when you commit the data source.
Normal Flow:
- Expand group - Delete entry - Delete entry - ...etc
Your Flow:
- Expand group - Delete entry - Expand group again - Delete entry - etc
I prepared a sample that shows igGrid with template delete button in the most right column, using column template functionality. The grid has also GroupBy feature enabled. I tested the behavior that you're describing and when I delete all rows from a certain group, the respective group is deleted as well. Attached you can find the sample for your reference. Please let me know if you have any further questions.