Data tables most popular and easy to use features

Earlier we learnt, how to use data tables to  create tables in easy way. Really cool yeah, Initially i also felt it’s something weird but when i start using it then i found that the code i was writing for a long time for  small features in tables are freebie for data tables. That’s cool :).

data-table-features

Today, i am going to share some cool data tables features, let’s get started :

1 – bAutoWidth :

Enable or disable automatic column width calculation. This can be disabled as an optimization (it takes some time to calculate the widths) if the tables widths are passed in using aoColumns.

$(document).ready( function () {
  $('#example').dataTable( {
    "bAutoWidth": false
  } );
} );

2-bFilter – Enable or disable filtering of data in data tables. Filtering in DataTables is cool feature that come handy when integrate it and it allows the end user to input multiple words (space separated) and will match a row containing those words, even if not in the order that was specified (this allows matching across multiple columns). By default, filtering option is true and you will see the feature for that. To remove the default filtering input box, make this property false.

$(document).ready( function () {
  $('#example').dataTable( {
    "bFilter": false
  } );
} );

3- bInfo
We can enable or disable the table information display. This shows information about the data that is currently visible on the page, including information about filtered data if that action is being performed. Default is always true.

Code example:

$(document).ready( function () {
  $('#example').dataTable( {
    "bInfo": false
  } );
} );

4- bPaginate : Cool feature for pagination. We have to write a complicated code on back end for pagination in tables. It’s comes free with data tables. Cool ? Yeah. By default it’s true always and if you don’t want pagination just make it false.

$(document).ready( function () {
  $('#example').dataTable( {
    "bPaginate": false
  } );
} );

5- bSort – Remember writing a complected code and query for sorting data in tables. i can assume many time you guys have written such code for sort data. But have you ever imagine that is cool default feature in data table. We can enable or disable sorting of columns. Sorting of individual columns can be disabled by the “bSortable” option for each column.

$(document).ready( function () {
  $('#example').dataTable( {
    "bSort": false
  } );
} );

Please write in comment section which feature you like most in data table or facing any issue. i will come with more features in data tables.

Add a Comment

Your email address will not be published. Required fields are marked *