How can I make table being capable of sorting with Twitter Bootstrap?

Brained Washed picture Brained Washed · Sep 29, 2012 · Viewed 15k times · Source

I want to know how can I make my table being capable of sorting with Twitter Bootstrap? What are the things to be considered?

Answer

ranjithnori picture ranjithnori · Aug 5, 2014

There is a library that provides the capability of sorting with bootstrap tables.

Here's a quick demonstration of how to use it.

HTML:

<table class="table table-bordered table-striped sortable">
   <thead>
      <tr>
      <th data-defaultsign="month" data-sortcolumn="1" data-sortkey="1-1">
       Date
      </th>
      </tr>
   </thead>
   <tbody>
     <tr>
        <td data-dateformat="D-M-YYYY">16.4.2004</td>
     </tr>
     <tr>
        <td data-dateformat="D-M-YYYY">6.7.2002</td>
     </tr>
     <tr>
        <td data-dateformat="D-M-YYYY">4.4.2004</td>
     </tr>
     <tr>
        <td data-dateformat="D-M-YYYY">6.6.2012</td>
     </tr>
   </tbody>
</table> 

JS:

(function () {
    var $table = $('table');
    $table.on('sorted', function () {
        console.log("Table was sorted.");
    });
}());

HTH.