2016-06-11 47 views
0

我正在使用datatables插件,但分頁不起作用。我已經實例化CSS和JS要求,但我不知道爲什麼這不起作用。jquery datatables不能與分頁

一切正常,只是分頁按鈕沒有,有什麼建議嗎?

HEAD:

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css"> 
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css"></style> 
<link rel="stylesheet" type="text/css" href="/css/bootstrap.vertical-tabs.min.css"></style> 

FOOTER: 

    <script type="text/javascript" src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script> 
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script> 
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> 
    <script src="/action/controller.js"></script><!-- this my js --> 

HTML: 

    <table id="datagrid_test" class="datagrid"> 
    <thead> 
    <tr> 
     <th>FIELD1</th> 
     <th>FIELD2</th> 
     <th>FIELD3</th> 
    </tr> 
    </thead> 
    <?php 
     for ($i=0; $i < 20 ; $i++) { ?> 
    <tr> 
     <td>aaa<?=$i?></td> 
     <td>bbb<?=$i?></td> 
     <td>ccc<?=$i?></td> 
    </tr> 
    <?php } ?> 
    </tr> 
    </table> 

JS: 

$(document).ready(function(){  
    $('#datagrid_test').dataTable(); 
} 

回答

0

我認爲問題的原因是庫的版本不匹配問題:你有數據表1.10.2和使用引導集成腳本1.10.12版本,所以只包括適當的數據表的版本來解決這個問題。

<script type="text/javascript" src="http://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> 
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script> 

還有一件事,它看起來就像在關閉表格標記之前有一個冗餘的關閉tr標記。

+0

謝謝@ConstantineUA。這是工作正常! –