Question

您好我使用jquery数据表1.9.4进行人口服务器端处理表。数据正确加载。但是分页没有按预期工作。实际上它有超过30行，而下一个，前一页和页码不起作用

var sTableAllCustomers = $('#tblAllCustomers').dataTable({
                "bDestroy": true,
                "bProcessing": true,
                "bServerSide" : true,
                "bLenthChange" : false,
                "iDisplayLength": 5,
                "aLengthMenu": [[5, 10, 25, 50, -1], [5, 10, 25, 50, "All"]],
                "sPaginationType" : "full_numbers",
                "sAjaxSource" : "loadAllCustomers",
                "oLanguage" : {
                    "sSearch" : "Search By Email ID:"
                },
                "aoColumns" : [
                 {"sTitle" : "No.","mData" : null,"aTargets": [ 0 ],
                    "fnRender" : function(obj) {
                        var columnIndex = obj.oSettings._iDisplayStart + obj.iDataRow+1
                        return columnIndex;
                    }
                },
                {"sTitle" : "Email ID","mData" : "email", "bSearchable" : true},
                {"sTitle" : "Devices","mData" : "device", "bSearchable" : false},
                {"sTitle" : "App Edition","mData" : "edition", "bSearchable" : false},
                {"sTitle" : "Account Type","mData" : "accountType", "bSearchable" : false},
                {"sTitle" : "Activated Date","mData" : "activatedDate", "bSearchable" : false},
                {"mData" : "id", "bSearchable": false,
                    "mRender": function (data, type, full ) {
                         return '<a id="'+data+'" datakey="'+full['key']+'" class="btnViewMoreInAllCustomers btn tooltipped more color-sec" data-tooltip="More" data-position="left"> <i class="mdi-notification-more"></i></a>';
                      }
                }
                ],
                   "fnServerData" : function(sSource, aoData, fnCallback) {
                    $.ajax({
                     "dataType" : 'json',
                     "type" : "GET",
                     "url" : sSource,
                     "data" : aoData,
                     "success" : fnCallback
                    });
                   },
            });

服务器端代码

int totalListSize = modals != null ? modals.size() : 0;
        CustomerDataTableObject dataTableObject = new CustomerDataTableObject();
        // the total data in db for datatables to calculate page no. and
        // position
        dataTableObject.setiTotalDisplayRecords(totalListSize);
        // the total data in db for datatables to calculate page no.
        dataTableObject.setiTotalRecords(totalListSize);
        dataTableObject.setsEcho(Integer.parseInt(request.getParameter("sEcho")));
        dataTableObject.setAaData(modals);
        Gson gson = new Gson();
        String json = gson.toJson(dataTableObject);

Answer 1

您正在使用iTotalRecords变量中存储的相同值初始化两个参数iTotalDisplayRecords和totalListSize。但是变量totalListSize包含返回的记录数，但它应该保存数据库中的记录总数。

来自documentation：

iTotalRecords

过滤前的总记录（即数据库中的记录总数）

iTotalDisplayRecords

过滤后的总记录（即应用过滤后的记录总数 - 不仅仅是此结果集中返回的记录数）

您需要单独计算数据库中的总记录数，并将其分配给iTotalRecords和iTotalDisplayRecords。

例如，如果您有30条记录，并且只有5可以显示在一个页面上，那么您的回复应该是：

{

    "sEcho": 1,
    "iTotalRecords": 30,
    "iTotalDisplayRecords": 30,
    "aaData": [
        {
            "DT_RowId": "row_8",
            "DT_RowClass": "gradeA",
            "0": "Gecko",
            "1": "Firefox 1.5",
            "2": "Win 98+ / OSX.2+",
            "3": "1.8",
            "4": "A"
        },
        // ... 4 more entries ... 
    ]
}

Answer 2

https://stackoverflow.com/posts/38213104/revisions

您可以参考上面的链接。

我在EntityController中使用以下代码

public async Task<IActionResult> LoadDataAsync([FromForm]JqueryDataTablesParameters parameters)
    {
        var (data, filtered, total) = await GetAllAsync(parameters, "Id", "Code", "Name");

        //Returning Json Data  
        return Json(new JqueryDataTablesResult<GradeDto>
        {
            Draw = parameters.Draw,
            Data = data,
            FilteredRecords = filtered,
            TotalRecords = total
        });
    }

jquery datatable分页不显示页数

2 个答案: