Henrique Van Klaveren Henrique Van Klaveren -5 years ago 368
jQuery Question

Jquery datatables does not work with pagination

I'm using datatables plugin, but the pagination does not work. I have instantiating CSS and JS requirement, but I don't know why this does not work.

Everything works, just pagination buttons not, any suggestions?


<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>


<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 -->


<table id="datagrid_test" class="datagrid">
for ($i=0; $i < 20 ; $i++) { ?>
<?php } ?>


$(document).ready( function(){

Answer Source

I believe the cause of problem is the mismatch of library versions: you have datatables 1.10.2 and you use script of bootstrap integration for version 1.10.12, so just include a proper version of datatables to fix the issue.

    <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>

One more thing, it looks like you have one redundant closing tr tag just before closing table tag.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download