rolandcedo
rolandcedo

Reputation: 47

Disabling sorting on nested DOM Element

I'm working with Datatables and have a TH with a nested checkbox:

    <th class="sku-checkbox-wrapper sorting_desc" rowspan="1" colspan="1" aria-label="Select All">Select All<br>  <input type="checkbox" id="sku_select_all" class="checkbox"></th> 

Currently, this TH has a sorting event handler attached to it. I would like to de-couple the nested checkbox from this event.

I have the TH set to 'bSortable':'true'. Is there a way to do something like 'bSortable' :' false' to the nested checkbox and keep the parent TH element sortable?

Upvotes: 0

Views: 31

Answers (1)

Gyrocode.com
Gyrocode.com

Reputation: 58900

You need to add click event handler for checkbox and prevent event propagation to parent element.

$("#sku_select_all").on('click', function(e){
   e.stopPropagation();
});

See this JSFiddle for demonstration.

Upvotes: 1

Related Questions