I want to select all my checkbox

I have an input in header of datatables like this

  <th style="width: 25%" ><input type="checkbox" name="checkall" class="select-checkall" id="checkall" value=""></th>

i use it like this to checked it but only work in the page that iam

   $("#checkall").click(function(){
            $(':checkbox').prop('checked', true);                       
     });  

check this fiddle /

I want to select all my checkbox

I have an input in header of datatables like this

  <th style="width: 25%" ><input type="checkbox" name="checkall" class="select-checkall" id="checkall" value=""></th>

i use it like this to checked it but only work in the page that iam

   $("#checkall").click(function(){
            $(':checkbox').prop('checked', true);                       
     });  

check this fiddle http://jsfiddle/juxHn/46/

• javascript
• jquery
• datatables

• can you create a fiddle for this? – Anoop Joshi P Commented Nov 10, 2015 at 11:17
• stackoverflow./a/23675009/4161269 – Anik Islam Abhi Commented Nov 10, 2015 at 11:20
• i try this but not working stackoverflow./questions/23637586/… check this fiddle jsfiddle/juxHn/2 – Mathias Stavrou Commented Nov 10, 2015 at 11:34

1 Answer 1

jQuery will not be able to find checkboxes in other pages than the current one because DataTables somehow hides them (maybe removes them from DOM?)

Please refer to DataTables API to access your table cells irrespective of which ones are currently shown or not / of which page you are on.

In your case, you could do:

// Use "DataTable" with upper "D"
oTableStaticFlow = $('#flow-table').DataTable({
    "aoColumnDefs": [{
        'bSortable': false,
        'aTargets': [0]
    }],
});

$("#flowcheckall").click(function () {
    var cells = oTableStaticFlow.column(0).nodes(), // Cells from 1st column
        state = this.checked;

    for (var i = 0; i < cells.length; i += 1) {
        cells[i].querySelector("input[type='checkbox']").checked = state;
    }
});

Demo: http://jsfiddle/juxHn/47/