Pagination hide

suser

I'm trying to create a table with jquery datatable and use this table is destroy but pagination and this line not destroy what should i do for this

Showing 1 to 10 of 36 entries

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.12.3.js"></script>
<script type="text/javascript" src="https://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>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /><link href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet" />
<link href=" https://cdn.datatables.net/buttons/1.2.2/css/buttons.bootstrap.min.css" rel="stylesheet" />
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.bootstrap.min.js"></script>
<link href="http://getbootstrap.com/dist/css/bootstrap.css" rel="stylesheet" />
<script type="text/javascript" src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet" />
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

I'm using:

      if ($.fn.DataTable.isDataTable("#tabledata")) {
                    ("#tabledata").DataTable().destroy();
                }
                $('#tabledata tbody > tr').remove();

 var data_insert = $('#tabledata').DataTable({
                  "dom": 'Blfrtip',
                  "columns": [

                {
                    "title": "RegNo",
                    "data": "RegNo"
                }, {
                    "title": "Owner",
                    "data": "Owner"

                },
                {
                    "title": "D D S B",
                    "data": "D D S B"

                },
                {
                    "title": "D P S B",
                    "data": "D P S B"

                }


                  ]

              });
    for (var i = 0; i < final.length; i++) {

        if (final[i] !== null) {
            $("#tabledata tbody").append("<tr><td>" +
                    final[i][0] + "</td> <td>" +
                    final[i][1] + "</td> <td>" +
                    final[i][2] + "</td> <td>" +
                    final[i][3] + "</td></tr>");
                }
            }

data_insert.draw();

<table id="tabledata"   cellspacing="0"  class="table inner_table  table-striped table-bordered  alltables display nowrap cell-border">
    <thead></thead>
    <tbody></tbody>
</table>

<input type="button" id="search_data"    class="sear_btn"  value="Search Data" />

suser

any help