Select checkboxes on page load

Examples below demonstrate how to check some checkboxes once table has been initialized.

This is possible with cell().checkboxes.select() API method.

Solution 1

Code shown below should work in all cases except HTML (DOM) data source or when deferred rendering is enabled in client-side processing mode with deferRender: true option. In that case see solution 2 below.

Example: Client-side processing

In the example below we are using client-side processing mode. Checkboxes and rows are selected for all employees with Software Engineer position.

Example: Server-side processing

In this example below we are demonstrating selecting checkboxes on page load using server-side processing mode. Checkboxes and rows are selected for all employees with Software Engineer position. You can also return dedicated field indicating whether checkbox should be pre-selected, for example is_selected.

Name Position Office Extn. Start date Salary
Name Position Office Extn. Start date Salary
$(document).ready(function (){
   var table = $('#example2').DataTable({
      'processing': true,
      'serverSide': true,
      'ajax': '/lab/jquery-datatables-checkboxes/ids-arrays.php',
      'columnDefs': [
         {
            'targets': 0,
            'checkboxes': {
               'selectRow': true
            },
            'createdCell':  function (td, cellData, rowData, row, col){
               if(rowData[2] === 'Software Engineer'){
                  this.api().cell(td).checkboxes.select();
               }
            }
         }
      ],
      'select': {
         'style': 'multi'
      },
      'order': [[1, 'asc']]
   });
});

Solution 2

Solution demonstrated below should be used in one of the following cases:

Example

In the example below checkboxes and row selection are disabled for all employees with Software Engineer position.