Translate

Tuesday, July 17, 2012

jQuery - Add Buttons to DataTables

A simple example of adding buttons to jQuery DataTables before the search filter.


$(document).ready(function() {
   $('#example').dataTable();
     
   $('<div />').addClass('UnSelectAllButton').css({'float' : 'left'}).attr({'id' : 'UnSelectAllButtons'}).prependTo($('#example_filter'));
     
   $('<button />').attr({
      'id' : 'deSelectAll'
   })
   .html('Deselect All')
   .appendTo($('#UnSelectAllButtons'));

   $('<button />').attr({
      'id' : 'selectAll'
   })
   .html('Select All')
   .appendTo($('#UnSelectAllButtons'));

   $('#deSelectAll').click( function () {
    alert( 'Deselect all.');
   });     
     
   $('#selectAll').click( function () {
    alert( 'Select all.');
  });
     
});

You can test it out here.

1 comment:

Thank you for commenting!