Remove Rows but Not the Header Row

[kencox]

Problem:

I'm using  columns.Select() in a grid to provide "Select All" functionality with checkboxes.

I have two rows remaining in the grid.

I manually select both. The "Select All" checkbox in the header comes on.

When I loop through to dynamically remove the selected rows from view, the following code finds the "Select All" checkbox in the header and removes the header row. I don't want that.

 Question:

What do I insert in Line 2 in the jQuery code below to detect that it has found the header row and should skip removing it?
I note that the header row has a direct <thead> parent which might be a clue to distinguishing between a regular row checkbox and a header row checkbox.

Thanks for any help.

1.$("#grid").find("input:checked").each(function () {
2.    // make sure this isn't the header row
3.    grid.removeRow($(this).closest('tr'));

[Eduardo Serra]

Hello Ken,

In order to detect if the checkbox being used to remove a row belongs to the header of the grid, we can check if the element has a parent of type th:

function removeCheckedRows(){
   $("#grid").find("input:checked").each(function () {
      var grid = $("#grid").data("kendoGrid");

      if (!$(this).parents('th').length) {
         grid.removeRow($(this).closest('tr'));
      }
   })
}

I have prepared a sample in the Kendo UI Dojo to demonstrate the approach described above; you can take a look at it here.

I hope this helps!

Regards,
Eduardo Serra
Progress Telerik