首页>>分页>>PHP+Ajax+dataTables无刷新分页演示(2016-04-27)

PHP+Ajax+dataTables无刷新分页演示

PHP+Ajax+dataTables无刷新分页演示

 

JavaScript Code
  1. <script type="text/javascript">  
  2.                     var datatables = $('#tables').dataTable({  
  3.                         "bServerSide"true,  
  4.                         'bPaginate'true//是否分页  
  5.                         "bProcessing"true//datatable获取数据时候是否显示正在处理提示信息。  
  6.                         "iDisplayLength": 2, //每页显示10条记录  
  7.                         'bFilter'true//是否使用内置的过滤功能  
  8.                         "sAjaxSource"'ajax.php',  
  9.                         "aaSorting": [  
  10.                             [0, "desc"],  
  11.                         ],  
  12.                         "aoColumns": [  
  13.                             {"mData""name""bSortable"true"bSearchable"true"sWidth""250px"},  
  14.                             {"mData""message""bSortable"true"bSearchable"true},  
  15.                             {"sWidth""220px""mData""updatetime""bSortable"true"mRender"function(data, type, full) {  
  16.                                     return "" + data + "";  
  17.                                 }  
  18.                             }  
  19.                         ],  
  20.                         "oLanguage": {  
  21.                             'sSearch''数据筛选:',  
  22.                             "sLengthMenu""每页显示 _MENU_ 项记录",  
  23.                             "sZeroRecords""没有符合项件的数据...",  
  24.                             "sInfo""当前数据为从第 _START_ 到第 _END_ 项数据;总共有 _TOTAL_ 项记录",  
  25.                             "sInfoEmpty""显示 0 至 0 共 0 项",  
  26.                             "sInfoFiltered""(_MAX_)"  
  27.                         },  
  28.                     });  
  29.                       
  30.         </script>    
XML/HTML Code
  1. <div class="table-responsive">  
  2.                    <table id="tables" class="table table-striped table-bordered table-hover">  
  3.                        <thead>  
  4.                            <tr>  
  5.                                <th>用户</th>  
  6.                                <th>内容</th>  
  7.                                <th>时间</th>  
  8.                            </tr>  
  9.                        </thead>  
  10.                        <tbody>  
  11.                        </tbody>  
  12.                    </table>  
  13.                </div>  

 


原文地址:http://www.freejs.net/article_fenye_553.html