javascript 如何在 Ajax 请求中发送当前页码

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/30975859/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 13:02:44  来源:igfitidea点击:

How to send current page number in Ajax request

javascriptjqueryajaxspring-mvcdatatables

提问by Narendra

I am using jQuery DataTable to display huge amount of data in a table. I am getting data page wise on Ajax request like this:

我正在使用 jQuery DataTable 在表格中显示大量数据。我在 Ajax 请求上获取数据页面,如下所示:

var pageNo = 1;
$('#propertyTable').dataTable( {
    "processing": true,
    "serverSide": true,
    "ajax": "${contextPath}/admin/getNextPageData/"+pageNo+"/"+10,
    "columns": [
        { "data": "propertyId" },
        { "data": "propertyname" },
        { "data": "propertyType" },
        { "data": "hotProperties" },
        { "data": "address" },
        { "data": "state" },
        { "data": "beds" },
        { "data": "city" },
        { "data": "zipCode" }
    ],
    "fnDrawCallback": function () {
        pageNo = this.fnPagingInfo().iPage+1;
        alert(pageNo); // this alerts correct page
     }
} );

and here is the spring controller:

这是弹簧控制器:

@RequestMapping(value="/getNextPageData/{pageNo}/{propertyPerPage}")
public @ResponseBody PropertyDatatableDto getNextPageData(@PathVariable Integer pageNo, @PathVariable Integer propertyPerPage) {
    System.out.println("called");
    System.out.println(pageNo); // this always prints 1, what i need is current pageNo here


    PropertyDatatableDto datatableDto = new PropertyDatatableDto();
    //datatableDto.setDraw(1);
    datatableDto.setRecordsTotal(100);
    datatableDto.setRecordsFiltered(100);
    datatableDto.setData(adminService.getAllPropertyList());
    return datatableDto;
}

The problem is that when I change page in table it alerts correct pageNoon page (in JavaScript), but in spring controller I am always getting the initial value assigned to the variable pageNoand not the current page number.

问题是,当我更改表格中的页面时,它会pageNo在页面上发出正确警报(在 JavaScript 中),但在 spring 控制器中,我总是得到分配给变量的初始值,pageNo而不是当前页码。

How do I pass pageNodynamically to spring controller? Any help is appreciated.

如何pageNo动态传递给弹簧控制器?任何帮助表示赞赏。

Edit:

编辑:

I updated JavaScript like this:

我像这样更新了 JavaScript:

    var oSettings = $('#propertyTable').dataTable().fnSettings();
    var currentPageIndex = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1; 

$('#propertyTable').dataTable({
    "processing": true,
    "serverSide": true,
    "ajax": "${contextPath}/admin/getNextPageData/"+currentPageIndex+"/"+10,
    "columns": [
        { "data": "propertyId" },
        { "data": "propertyname" },
        { "data": "propertyType" },
        { "data": "hotProperties" },
        { "data": "address" },
        { "data": "state" },
        { "data": "beds" },
        { "data": "city" },
        { "data": "zipCode" }
    ]
});

But it's giving me an error:

但它给了我一个错误:

DataTables warning: table id=propertyTable - Cannot reinitialise DataTable.

DataTables 警告:table id=propertyTable - 无法重新初始化 DataTable。

回答by Gyrocode.com

DataTables already sends parameters startand lengthin the request that you can use to calculate page number, see Server-side processing.

DataTables 已经发送了参数,start并且length在您可以用来计算页码的请求中,请参阅服务器端处理

If you still need to have the URL structure with the page number, you can use the code below:

如果你仍然需要有页码的 URL 结构,你可以使用下面的代码:

"ajax": {
   "data": function(){
      var info = $('#propertyTable').DataTable().page.info();

      $('#propertyTable').DataTable().ajax.url(
          "${contextPath}/admin/getNextPageData/"+(info.page + 1)+"/"+10
      );
   }
},

回答by SSA

"Untested" Edit: Added "retrieve": true in options to retrieve the table instance (v1.10), checked if table exists. Changed fnSettings to setting() for datatable v1.10.

“未测试”编辑:在检索表实例(v1.10)的选项中添加了“检索”:true,检查表是否存在。将数据表 v1.10 的 fnSettings 更改为 setting()。

You can try to read from the datatable settings and then from settings read _iDisplayStartand _iDisplayLength, then calculate current page index as follows:

您可以尝试从数据表设置中读取,然后从设置中读取_iDisplayStart_iDisplayLength,然后按如下方式计算当前页面索引:

var currentPageIndex  = 1;
//Is datatable already initialized? 
if ( $.fn.DataTable.isDataTable( '#propertyTable' ) ) {
//Get the current settings and calculate current page index
    var oSettings = $('#propertyTable').dataTable({"retrieve": true}).settings();
    currentPageIndex = Math.ceil(oSettings._iDisplayStart / oSettings._iDisplayLength) + 1;


}

then in ajax call pass currentPageIndex:

然后在ajax调用中传递currentPageIndex:

 "ajax": "${contextPath}/admin/getNextPageData/"+currentPageIndex +"/"+10,