jQuery DataTables Tüm kayıtları kayıt olarak görüntüle

Question

Yüklü olduğum bir web uygulaması için satın alınmış bir Yönetici temasını kullanıyorum. Bu tema jQuery dataTables için stilleri ile geldi. Sayfadaki kayıtlara bir Görünüm Tüm Kayıtlar seçeneğini nasıl ekleyeceğimi anlamaya çalışıyorum ama temanın önceliği geldiği için zaten yazılan çok fazla kod var ve ihtiyacım olan şeyleri nasıl ekleyeceğimi bilmiyorum. .

Altbilgi Kodu: I (ben başka yığın taşması soruya değerini temel düşünün) Eklemek için istediğiniz ne

<!-- jQuery DataTable --> 
    <script src="<?php echo base_url(); ?>assets/js/plugins/dataTables/jquery.datatables.min.js"></script> 
    <script> 
     /* Default class modification */ 
     $.extend($.fn.dataTableExt.oStdClasses, { 
      "sWrapper": "dataTables_wrapper form-inline" 
     }); 

     /* API method to get paging information */ 
     $.fn.dataTableExt.oApi.fnPagingInfo = function (oSettings) 
     { 
      return { 
       "iStart":   oSettings._iDisplayStart, 
       "iEnd":   oSettings.fnDisplayEnd(), 
       "iLength":  oSettings._iDisplayLength, 
       "iTotal":   oSettings.fnRecordsTotal(), 
       "iFilteredTotal": oSettings.fnRecordsDisplay(), 
       "iPage":   Math.ceil(oSettings._iDisplayStart/oSettings._iDisplayLength), 
       "iTotalPages": Math.ceil(oSettings.fnRecordsDisplay()/oSettings._iDisplayLength) 
      }; 
     } 

     /* Bootstrap style pagination control */ 
     $.extend($.fn.dataTableExt.oPagination, { 
      "bootstrap": { 
       "fnInit": function(oSettings, nPaging, fnDraw) { 
        var oLang = oSettings.oLanguage.oPaginate; 
        var fnClickHandler = function (e) { 
         e.preventDefault(); 
         if (oSettings.oApi._fnPageChange(oSettings, e.data.action)) { 
          fnDraw(oSettings); 
         } 
        }; 

        $(nPaging).addClass('pagination').append(
         '<ul>'+ 
          '<li class="prev btn-small disabled"><a href="#"><span class="awe-caret-left"></span> '+oLang.sPrevious+'</a></li>'+ 
          '<li class="next btn-small disabled"><a href="#">'+oLang.sNext+' <span class="awe-caret-right"></span></a></li>'+ 
         '</ul>' 
        ); 
        var els = $('a', nPaging); 
        $(els[0]).bind('click.DT', { action: "previous" }, fnClickHandler); 
        $(els[1]).bind('click.DT', { action: "next" }, fnClickHandler); 
       }, 

       "fnUpdate": function (oSettings, fnDraw) { 
        var iListLength = 0; 
        var oPaging = oSettings.oInstance.fnPagingInfo(); 
        var an = oSettings.aanFeatures.p; 
        var i, j, sClass, iStart, iEnd, iHalf=Math.floor(iListLength/2); 

        if (oPaging.iTotalPages < iListLength) { 
         iStart = 1; 
         iEnd = oPaging.iTotalPages; 
        } 
        else if (oPaging.iPage <= iHalf) { 
         iStart = 1; 
         iEnd = iListLength; 
        } else if (oPaging.iPage >= (oPaging.iTotalPages-iHalf)) { 
         iStart = oPaging.iTotalPages - iListLength + 1; 
         iEnd = oPaging.iTotalPages; 
        } else { 
         iStart = oPaging.iPage - iHalf + 1; 
         iEnd = iStart + iListLength - 1; 
        } 

        for (i=0, iLen=an.length ; i<iLen ; i++) { 

         // Add/remove disabled classes from the static elements 
         if (oPaging.iPage === 0) { 
          $('li:first', an[i]).addClass('disabled'); 
         } else { 
          $('li:first', an[i]).removeClass('disabled'); 
         } 

         if (oPaging.iPage === oPaging.iTotalPages-1 || oPaging.iTotalPages === 0) { 
          $('li:last', an[i]).addClass('disabled'); 
         } else { 
          $('li:last', an[i]).removeClass('disabled'); 
         } 
        } 
       } 
      } 
     }); 

    </script> 

: İşte ne var

sizin oTable yana

oTable = $('#example').dataTable({ "aLengthMenu": [ 
     [25, 50, 100, 200, -1], 
     [25, 50, 100, 200, "All"] 
    ], 


"iDisplayLength" : -1 }); 

Answer 1

aşağıdadır dataTable örneği, deneyin:

var oSettings = oTable.fnSettings(); 
oSettings._iDisplayLength = 500; 
oTable.fnDraw(); 

Sen bir onClick bu koyabilirsiniz o:

var oSettings = oTable.fnSettings(); 

$('.changeLength').click(function(e){ 
    oSettings._iDisplayLength = 500; 
    oTable.fnDraw(); 
}); 

Düğmeyi tıklattığınızda, bu şekilde tablo uzunluğunu değiştirir.