jQuery DataTables: Row grouping and checkboxes

Example

Name Position Office Extn. Start date Salary
Name Position Office Extn. Start date Salary
$(document).ready(function(){
   var table = $('#example').DataTable({
      'ajax': '/lab/articles/jquery-datatables-row-grouping-and-checkboxes/arrays.txt',
      'rowsGroup': [0, 3],
      'columns': [
         {
            'data': 2,
            'checkboxes': {
               'selectRow': false
            }
         },
         { 'data': 0 },
         { 'data': 1 },
         { 'data': 2 },
         { 'data': 3 },
         { 'data': 4 },
         { 'data': 5 }
      ]
   });
});

In addition to the above code, the following Javascript library files are loaded for use in this example:

//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js
https://cdn.datatables.net/v/dt/dt-1.10.12/datatables.min.js
https://cdn.rawgit.com/ashl1/datatables-rowsgroup/fbd569b8768155c7a9a62568e66a64115887d7d0/dataTables.rowsGroup.js
https://gyrocode.github.io/jquery-datatables-checkboxes/1.1.3/js/dataTables.checkboxes.min.js

The following CSS library files are loaded for use in this example to provide the styling of the table:

https://cdn.datatables.net/v/dt/dt-1.10.12/datatables.min.css
https://gyrocode.github.io/jquery-datatables-checkboxes/1.1.3/css/dataTables.checkboxes.css

You Might Also Like

Leave a Reply

You may use simple HTML to add links or lists to your comment. Also use <pre><code class="language-*">...</code></pre> to mark up code snippets. We support language-js, language-markup and language-css for comments.
(Optional)

This site uses Akismet to reduce spam. Learn how your comment data is processed.