在 jquery 数据表中使用 Ajax 进行分页
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6251950/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Pagination using Ajax in jquery Datatables
提问by kshtjsnghl
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.
我正在将 dataTables 插件用于我正在处理的页面上的表格。它基本上通过ajax调用获取行，在这个ajax调用中，我发送用户选择的搜索参数和所需的页码。我需要 Next、Previous、First 和 Last 按钮也触发相同的 ajax 调用，但使用不同的页码，因为后端拦截器取决于页码。
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).
这个 api 调用将返回总数。属于这些搜索参数的行（比如 1000）和具有页面大小的行（比如 50）。
Is there any way, I can use data table to do this?
有什么办法，我可以使用数据表来做到这一点吗？
回答by Dan
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.
页面加载后，它将向指定的源发送 POST 请求。默认情况下，请求使用 GET 方法，但我选择发布该值。
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
您可以参考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.
当页面更改时，接受请求的服务器端代码必须处理 iDisplayStart 变量。它从 0 开始，然后每页增加 iDisplayLength 值。Oliver 给出的例子包括一个 PHP 服务器端的例子，所以这对复习很有帮助。
回答by Oliver M Grech
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.
然后检查 API 以正确显示您想要的按钮等。
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"});
回答by tawman
I wrote a blog post on Server-Side Paging with PetaPoco and DataTablesand put a corresponding sample ASP.NET MVC3 in C# solution on GitHub
我写了一篇关于使用 PetaPoco 和 DataTables进行服务器端分页的博客文章，并将相应的示例 ASP.NET MVC3 放在GitHub 上的C# 解决方案中
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.
我没有看到对您的服务器端语言的引用，但 C# 解决方案说明了从 DataTables 接收 ajax POST、查询数据库以及格式化 DataTables 的 Json 响应以处理响应的服务器端 Json 交互。
Hope this helps.
希望这可以帮助。
回答by Zishanali
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
});
