Pagination using Ajax in jquery Datatables

I am using dataTables plugin for a table on a page I am working on. Its basically fetching rows through an ajax call and in this ajax call, I send the 开发者_开发百科search params that the user selects and the page number required. I need the Next, Previous, First and Last buttons to also fire the same ajax call, but with different page numbers, as the back-end interceptor depends on the page number.

This api call would return total no. of rows(say 1000) belonging for these search params and the rows with the page size( say 50).

Is there any way, I can use data table to do this?

Yes, you can complete this and I have done it on a number of sites. The key is for the proper initialization of the datatable with code such as this:

var oTable = "";

$(document).ready(function() {
    oTable = $('#htmltableID').dataTable({
        "sPaginationType": "full_numbers",
        "bServerSide": true,
        "sAjaxSource": "/script-to-accept-request.php",
        "sServerMethod": "POST",
        "iDisplayLength": 50
    });
}

Once the page loads it will send a POST request to the source indicated. The request by default uses the GET method, but I choose to post that values instead.

You can add custom variables to be included in the default set by referring to http://www.datatables.net/release-datatables/examples/server_side/custom_vars.html

The server side code that will take the request will have to handle the iDisplayStart variable when the page is changed. This starts at 0 and then increases by the iDisplayLength value with each page. The example given by Oliver includes an example with PHP server side so that would really be helpful to review.

Yes you can do that,

Firstly, have a look in detail here

and then check the API to correctly display the buttons etc you want.

I'm using the same plugin in a very big projects and it works flawlessly.

The configuration type I use on my table is the following

$("#mytable").dataTable({"bJQueryUI": true,"sPaginationType": "full_numbers"}); 

I wrote a blog post on Server-Side Paging with PetaPoco and DataTables and put a corresponding sample ASP.NET MVC3 in C# solution on GitHub

I did not see a reference to your server-side language, but the C# solution illustrates the server-side Json interaction of receiving the ajax POST from DataTables, querying the database, and formatting the Json response for DataTables to process the response.

Hope this helps.

try this.. I am sure this will work for you.

$("#myDataTable").dataTables({
     "bJQueryUI":true,
      "bSort":false,
      "bPaginate":true, // Pagination True 
      "sPaginationType":"full_numbers", // And its type.
       "iDisplayLength": 10
});