如何在Ajax请求中发送当前页码 [英] How to send current page number in Ajax request

问题描述

我正在使用jQuery DataTable在表中显示大量的数据。我正在以Ajax的方式获取数据页：

  var pageNo = 1; 
 $（'＃propertyTable'）。dataTable（{
processing：true，
serverSide：true，
ajax：$ {contextPath} / admin / getNextPageData /+ pageNo +/+ 10，
列：[
 {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）; //这会提醒正确的页面
} 
}）; 
  

这里是弹簧控制器：

  @RequestMapping（value =/ getNextPageData / {pageNo} / {propertyPerPage}）
 public @ResponseBody PropertyDatatableDto getNextPageData（@PathVariable Integer pageNo，@PathVariable Integer propertyPerPage）{
 System.out.println（called）; 
 System.out.println（pageNo）; //这总是打印1，我需要的是当前页面不在这里
 
 
 PropertyDatatableDto datatableDto = new PropertyDatatableDto（）; 
 //datatableDto.setDraw(1）; 
 datatableDto.setRecordsTotal（100）; 
 datatableDto.setRecordsFiltered（100）; 
 datatableDto.setData（adminService.getAllPropertyList（））; 
 return datatableDto; 
} 
  

问题是，当我更改表中的页面时，它提醒正确 pageNo 在页面上（在JavaScript中），但在spring控制器中，我总是得到分配给变量 pageNo 的初始值，而不是当前页码。

如何动态地向弹簧控制器传递 pageNo ？任何帮助都不胜感激。

编辑：

我更新了这样的JavaScript：

  var oSettings = $（'＃propertyTable'）。dataTable（）。fnSettings（）; 
 var currentPageIndex = Math.ceil（oSettings._iDisplayStart / oSettings._iDisplayLength）+ 1; 
 
 $（'＃propertyTable'）。dataTable（{
processing：true，
serverSide：true，
ajax：$ {上下文路径} / admin / getNextPageData /+ currentPageIndex +/+ 10，
列：[
 {data：propertyId}，
 {data 
 {data：propertyType}，
 {data：hotProperties}，
 {data：address}，
 { data：state}，
 {data：beds}，
 {data：city}，
 {data：zipCode} 
] 
}）; 
  

但它给我一个错误：

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

解决方案

数据表已经在可用于计算页码的请求中发送参数开始和长度，请参见< a href =http://datatables.net/manual/server-side>服务器端处理。

如果您仍然需要具有页码的URL结构，可以使用以下代码：

 ajax：{
data ：function（）{
 var info = $（'＃propertyTable'）。DataTable（）。page.info（）; 
 
 $（'＃propertyTable'）。DataTable（）。ajax.url（
$ {contextPath} / admin / getNextPageData /+（info.page + 1）+/ +10 
）; 
} 
}，
  

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:

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 pageNo on page (in JavaScript), but in spring controller I am always getting the initial value assigned to the variable pageNo and not the current page number.

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

Edit:

I updated JavaScript like this:

    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 already sends parameters start and length in the request that you can use to calculate page number, see Server-side processing.

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

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

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

这篇关于如何在Ajax请求中发送当前页码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！