How to trigger next button in DataTables after it reaches to 10 rows

How to automatically click next button in Data-tables after it reaches to 10 rows. The way I add rows is dynamic so when I reaches to my 11 rows i want to automate the next button so from the first page it will move to 2nd page.

I've tried to use the code below from Data-tables

But base on documentation:

If multiple data points match the requested data, the paging will be shifted to show the first instance. If there are no matches, the paging will not change.

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 / ); page ).draw( false );

    return this;
} );

So i want something that will shift the page to the next page after it reaches 11 rows. Please help. Thanks in advance.

Here is my code:

$('.btn').on( 'click', function () {
      var dTable1 = $('#list-table').DataTable();

                "brand": $('#brand').val(),
                "category": $('#category').val(),
                "code": $('#code').val(),
                "description":  $('#description').val(),
                "unit": $('#unit').val(),
                "qty": $('#input-qty').val(),
                "unit_price":   $('#unit_price').val(),
                "action": '<i class="glyphicon glyphicon-remove"></i>'

        $('#list-table').dataTable().fnPageChange('last'); //This is not working


Here is the fiddle :

Answers 1

  • Reference:- Datatables -jump to last page by-default

    var dTable1 = $('#search-table').DataTable();
    <script src=""></script>
    <script src=""></script>
    <link rel = "stylesheet" href= "">
    <table class="table table-striped table-bordered dt-responsive nowrap" id="search-table" width="100%">
            <th>Unit Price</th>
    <button type="submit" class="btn btn-primary">add</button>

Related Articles