DataTable Pagination is not working on my table

I Want to apply Datatable pagination on my table but it is not working. it takes space at the bottom of the table but nothing prints. added required script and css file but still getting nothing. i am providing dummy table here.

       $(document).ready(function () {
        $('.table').DataTable({
            "order": [[ 0, "desc" ]],
            "language": {
                "lengthMenu": "Page Size _MENU_ ",
                "zeroRecords": "No records found to display",
                "info": "Showing page _PAGE_ of _PAGES_",
                "infoEmpty": "No records available",
                "infoFiltered": "(filtered from _MAX_ total records)"
            }
        });

    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="cdn.datatables.net/1.12.1/css/jquery.dataTables.min.css"/>
<script src="cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js"></script>


<table id="example" class="table table-striped table-bordered table-hover table-responsive display" width="100%" cellspacing="0">
<thead>
  <tr>
    <th>Animal</th>
    <th class="vertalign">Select 3 <input type="checkbox" class="checkbox-inline" name="selectAllChkBox" id="selectAllChkBox">     
  </tr>
 </thead>
 <tbody>
  <tr>
    <td>Cat</td>
    <td class="vertalign" rowspan="5"><input class="checkbox-inline" type="checkbox" value="cat"  name="chkBox"></td>
  </tr>
   <tr>
    <td>Dog</td>
    <td class="vertalign" rowspan="5"><input class="checkbox-inline" type="checkbox" value="dog"  name="chkBox"></td>
  </tr>
   <tr>
    <td>Cow</td>
    <td class="vertalign" rowspan="5"><input class="checkbox-inline" type="checkbox" value="cow"  name="chkBox"></td>
  </tr>
   <tr>
    <td>Mouse</td>
    <td class="vertalign" rowspan="5"><input class="checkbox-inline" type="checkbox" value="mouse"  name="chkBox"></td>
  </tr>
   <tr>
    <td>Goat</td>
    <td class="vertalign" rowspan="5"><input class="checkbox-inline" type="checkbox" value="goat"  name="chkBox"></td>
  </tr>
    
  </tbody>
</table>

DataTable Pagination is not working on my table

0 Answers