uncheck checkbox with fnDrawCallback for DataTables

Question

I have a checkbox in the thead of my table. If the datatable is redrawn (by filtering, searching, pagination, whatever) I want to make sure this is unchecked.

"fnDrawCallback": function() {
  $(".checkboxes").uniform();
  $(".table-checkbox input[type=checkbox]").attr('checked', false);
  alert( 'DataTables has redrawn the table' );
}

The uniform call fixes a stylization problem within the datatable... the alert is just to to show after each redraw.

Does it matter that .table-checkbox is outside of the datatable and not dynamic (it is explicitly in the html of the thead)? I just want to make sure it is always unchecked upon table redraw.

EDIT :

The following works... is there a better way to do this? Apparently I need to call uniform on the thead as well to do this.

"fnDrawCallback": function() {
  $(".table-checkbox input[type=checkbox]").attr('checked', false);
  $(".checkboxes").uniform();
  $(".group-checkable").uniform();
  alert( 'DataTables has redrawn the table' );
}

score 0 · Accepted Answer · edited May 23 '17 at 12:19

Seems to me that this is a general uniform problem. In the above you first uncheck the checkboxes by code, then reinitalizes all the checkboxes so they seem to be unchecked by code, but in fact they are just reinitialized / reuniformed'!

See this question (and answer) -> jQuery Uniform Checkbox does not (un)check

The only code you should need is

fnDrawCallback: function() {
   $(this).find('thead input[type=checkbox]').removeAttr('checked');
   $.uniform.update();
}

If you are using sorting you should replace fnDrawCallback with fnInfoCallback since fnDrawCallback in that case will be fired even if you click on the checkboxes only!

uncheck checkbox with fnDrawCallback for DataTables

1 Answers1