DataTables - page.jumpToData()
HTML
<link rel="stylesheet" href="https://cdn.datatables.net/r/dt/dt-1.10.9/datatables.min.css">
<script src="https://cdn.datatables.net/r/dt/dt-1.10.9/datatables.min.js"></script>
Current Page Number: <input type="text" id="xCPN">
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
</tr>
<tr>
<td>Garrett Winters</td>
<td>Accountant</td>
<td>Tokyo</td>
<td>63</td>
<td>2011/07/25</td>
<td>$170,750</td>
</tr>
<tr>
<td>Ashton Cox</td>
<td>Junior Technical Author</td>
<td>San Francisco</td>
<td>66</td>
<td>2009/01/12</td>
<td>$86,000</td>
</tr>
<tr>
<td>Bradley Greer</td>
<td>Software Engineer</td>
<td>London</td>
<td>41</td>
<td>2012/10/13</td>
<td>$132,000</td>
</tr>
<tr>
<td>Dai Rios</td>
<td>Personnel Lead</td>
<td>Edinburgh</td>
<td>35</td>
<td>2012/09/26</td>
<td>$217,500</td>
</tr>
<tr>
<td>Jenette Caldwell</td>
<td>Development Lead</td>
<td>New York</td>
<td>30</td>
<td>2011/09/03</td>
...
JavaScript
$(".dataTables_filter").hide();
jQuery.fn.dataTable.Api.register( 'page.jumpToData()', function ( data, column ) {
var pos = this.column(column, {order:'current'}).data().indexOf( data );
if ( pos >= 0 ) {
var page = Math.floor( pos / this.page.info().length );
this.page( page ).draw( false );
}
return this;
} );
$(document).ready(function (){
$('#example').DataTable({
responsive: true,
order: [2, 'asc'],
bFilter: false,
columnDefs: [{ searchable: false, orderable: false, targets: [0] }],
lengthMenu: [[3], [3]],
lengthChange: false,
pagingType: "simple",
searching: true,
});
var table = $('#example').DataTable();
table.page.jumpToData('Thor Walton', 0);
// var info = table.page.info();
$('#xCPN').val(table.page.info().page);
});