Need to check/uncheck a checkbox on all table rows including on other pages

tdevoe@acord.org

I am attempting to check/uncheck a checkbox that is a column on each row. If I examine $('#grid').DataTable().rows().nodes(), this only returns the rows that are visible on the current page. Of course if I examine $('#grid').DataTable().rows(), this returns the indexes of all rows. It appears that I have to use the nodes method to actually manipulate the DOM.

Do I have to loop through all of the rows to do this?

Is there a way an easier way to check/uncheck all of the results on all pages?

Thanks.

tdevoe@acord.org

I was able to find the answer. It took a while .
https://datatables.net/forums/discussion/27809

tdevoe@acord.org

I thought I had found the answer but the solution exhibits strange behavior. As an example, I return 200 rows and have the paging set to 10 rows per page. I have a button which checks all the rows using the following code which is described in the link mentioned in my previous comments above. If I click the button to select all, only the first page rows check boxes are selected, other rows check boxes are not selected. If I then click the button to select all, all of the pages are now checked correctly.

$('input', table.cells().nodes()).prop('checked',true); 

Any ideas?

Thanks,
Tom

kthorngren

That code snippet works for me to check all boxes across all pages. I would suggest providing a test case showing your issue.

Kevin

allan

There are two things that can effect this:

1. deferRender - if this is enabled and not all rows have been created, then you won't be able to select the checkbox for every row, since they might not exist!
2. serverSide - Only the rows currently shown on the client-side actually exist on the client-side. That's a fundamental part of server-side processing.

Based on what you describe I very much suspect that it is 1. If you want to be able to select all nodes, then you need the nodes to have been created and you'd need to disable the deferRender option.

Allan

tdevoe@acord.org

Allan,
Thank you for your response. I did find that using the select-checkbox class instead of specifying a checkbox input field works well since I'm only trying to tie row selection to the checkbox.

However, I noticed in the example here (as well as in my code): https://datatables.net/extensions/select/examples/initialisation/checkbox.html that the select all checkbox in the header does not select all the rows as I would have expected.

I started looking at removing the checkbox from the header and provide the user with buttons to select and deselect all but felt it would be better to include both approaches.

Thanks again for your help! Your product has been great to work with.
Tom

allan

that the select all checkbox in the header does not select all the rows as I would have expected.

No. That's a bug that was fixed here. There is no select all checkbox provided by Select (yet).

The fact that the checkbox was rendered in the header was incorrect.

Allan

tdevoe@acord.org

Thanks for the information. I have a version of the file called Select.dataTable.min.css which has the related tags which need to be modified. My version of the Select extension is not the the SCSS version of the file.

I was able to modify the Select.dataTable.min.css which removes the checkbox.

Is the fix available in the CSS versions of the files as well? If so, where in GitHub are the changes?

Thanks.
Tom

tdevoe@acord.org

I am good now. I'm not sure how I ended up with the Select.dataTable.min.css file. I pointed to the Select.dataTables.min.css and the behavior is correct.

Thanks.
Tom