Advertisement
Guest User

Bootstrap DataTables

a guest
Apr 28th, 2012
739
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /* Default class modification */
  2. $.extend( $.fn.dataTableExt.oStdClasses, {
  3.     "sWrapper": "dataTables_wrapper form-inline"
  4. } );
  5.  
  6. /* API method to get paging information */
  7. $.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings )
  8. {
  9.     return {
  10.         "iStart":         oSettings._iDisplayStart,
  11.         "iEnd":           oSettings.fnDisplayEnd(),
  12.         "iLength":        oSettings._iDisplayLength,
  13.         "iTotal":         oSettings.fnRecordsTotal(),
  14.         "iFilteredTotal": oSettings.fnRecordsDisplay(),
  15.         "iPage":          Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ),
  16.         "iTotalPages":    Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength )
  17.     };
  18. }
  19.  
  20. /* Bootstrap style pagination control */
  21. $.extend( $.fn.dataTableExt.oPagination, {
  22.     "bootstrap": {
  23.         "fnInit": function( oSettings, nPaging, fnDraw ) {
  24.             var oLang = oSettings.oLanguage.oPaginate;
  25.             var fnClickHandler = function ( e ) {
  26.                 e.preventDefault();
  27.                 if ( oSettings.oApi._fnPageChange(oSettings, e.data.action) ) {
  28.                     fnDraw( oSettings );
  29.                 }
  30.             };
  31.  
  32.             $(nPaging).addClass('pagination').append(
  33.                 '<ul>'+
  34.                     '<li class="prev disabled"><a href="#">&larr; '+oLang.sPrevious+'</a></li>'+
  35.                     '<li class="next disabled"><a href="#">'+oLang.sNext+' &rarr; </a></li>'+
  36.                 '</ul>'
  37.             );
  38.             var els = $('a', nPaging);
  39.             $(els[0]).bind( 'click.DT', { action: "previous" }, fnClickHandler );
  40.             $(els[1]).bind( 'click.DT', { action: "next" }, fnClickHandler );
  41.         },
  42.  
  43.         "fnUpdate": function ( oSettings, fnDraw ) {
  44.             var iListLength = 5;
  45.             var oPaging = oSettings.oInstance.fnPagingInfo();
  46.             var an = oSettings.aanFeatures.p;
  47.             var i, j, sClass, iStart, iEnd, iHalf=Math.floor(iListLength/2);
  48.  
  49.             if ( oPaging.iTotalPages < iListLength) {
  50.                 iStart = 1;
  51.                 iEnd = oPaging.iTotalPages;
  52.             }
  53.             else if ( oPaging.iPage <= iHalf ) {
  54.                 iStart = 1;
  55.                 iEnd = iListLength;
  56.             } else if ( oPaging.iPage >= (oPaging.iTotalPages-iHalf) ) {
  57.                 iStart = oPaging.iTotalPages - iListLength + 1;
  58.                 iEnd = oPaging.iTotalPages;
  59.             } else {
  60.                 iStart = oPaging.iPage - iHalf + 1;
  61.                 iEnd = iStart + iListLength - 1;
  62.             }
  63.  
  64.             for ( i=0, iLen=an.length ; i<iLen ; i++ ) {
  65.                 // Remove the middle elements
  66.                 $('li:gt(0)', an[i]).filter(':not(:last)').remove();
  67.  
  68.                 // Add the new list items and their event handlers
  69.                 for ( j=iStart ; j<=iEnd ; j++ ) {
  70.                     sClass = (j==oPaging.iPage+1) ? 'class="active"' : '';
  71.                     $('<li '+sClass+'><a href="#">'+j+'</a></li>')
  72.                         .insertBefore( $('li:last', an[i])[0] )
  73.                         .bind('click', function (e) {
  74.                             e.preventDefault();
  75.                             oSettings._iDisplayStart = (parseInt($('a', this).text(),10)-1) * oPaging.iLength;
  76.                             fnDraw( oSettings );
  77.                         } );
  78.                 }
  79.  
  80.                 // Add / remove disabled classes from the static elements
  81.                 if ( oPaging.iPage === 0 ) {
  82.                     $('li:first', an[i]).addClass('disabled');
  83.                 } else {
  84.                     $('li:first', an[i]).removeClass('disabled');
  85.                 }
  86.  
  87.                 if ( oPaging.iPage === oPaging.iTotalPages-1 || oPaging.iTotalPages === 0 ) {
  88.                     $('li:last', an[i]).addClass('disabled');
  89.                 } else {
  90.                     $('li:last', an[i]).removeClass('disabled');
  91.                 }
  92.             }
  93.         }
  94.     }
  95. } );
  96.  
  97. /* Table initialisation */
  98. $(document).ready(function() {
  99.     $('#sortable').dataTable( {
  100.         "bPaginate": false     
  101.     } );
  102. } );
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement