jquery数据表分页不起作用

Posted 2023-05-09

【中文标题】jquery数据表分页不起作用

【英文标题】：jquery datatables pagination not working

【发布时间】：2017-10-27 00:10:13

【问题描述】：

我是 jquery 数据表的新手，我有一个简单的函数，它调用 ajax 并将响应映射到数据表中，该函数可以正常工作，但是分页无法正常工作，任何建议都会很好。这是我的代码。

    function loadJson() 

    $('#datatable')
            .dataTable(
                    
                        "bProcessing" : true,
                        "bPaginate" : true,
                        "bServerSide" : true,
                        "sServerMethod" : "GET",
                        "sAjaxSource" : "$pageContext.request.contextPath/emi/calculate?jsonValue="
                                + jsonData,
                        "sAjaxDataProp" : "",
                        "fnRowCallback" : function(nRow, aData,
                                iDisplayIndex) 
                            $("td:first", nRow).html(iDisplayIndex + 1);
                            return nRow;
                        ,

                        "aoColumns" : [ 
                            "mData" : null
                        , 
                            "mData" : "emiDate"
                        , 
                            "mData" : "principle"
                        , 
                            "mData" : "interestAmount"
                        , 
                            "mData" : "emi"
                        , 
                            "mData" : "loanOutstanding"
                         ]
                    );

我得到了this 输出，问题是，显示条目不起作用，我只有 11 条记录，我得到了 1、2、3、4 页码，应该只有 1、2，只有 10 条记录需要在那里。我在这里错过了什么？

【问题讨论】：

添加这个，"pagingType": "full_numbers","paging": true,

consol 中会出现哪些错误

控制台没有错误。

@TrimantraSoftwareSolution ，是的，添加但没有解决。

【参考方案1】：

你必须添加这个，

   "pagingType": "full_numbers",
   "paging": true,
   "lengthMenu": [10, 25, 50, 75, 100],

【讨论】：

参考此链接***.com/questions/38475379/…

它会帮助你

感谢您的回复，我是新手，工作小提琴或任何详细的工作代码都会很棒。谢谢

我会看到的。

【参考方案2】：

尝试在你的数据表声明中使用这个属性

     function loadJson() 

    $('#datatable')
            .DataTable(
                    

                        "sServerMethod" : "GET",
                        "sAjaxSource" : "$pageContext.request.contextPath/emi/calculate?jsonValue="
                                + jsonData,
                        "sAjaxDataProp" : "",


                        "aoColumns" : [ 
                            "mData" : null
                        , 
                            "mData" : "emiDate"
                        , 
                            "mData" : "principle"
                        , 
                            "mData" : "interestAmount"
                        , 
                            "mData" : "emi"
                        , 
                            "mData" : "loanOutstanding"
                         ],
                        "bProcessing" : true,
                        "bPaginate" : true,
                        "bServerSide" : true
                    );

【讨论】：

数据表可以使用哪个js？

<script type="text/javascript" src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>

数据表只能用这个js

尝试像这样使用$('#datatable').DataTable()。 将数据表 d 设置为大写

$('#datatable').dataTable() ，这就是我正在使用的

【参考方案3】：

https://***.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
    );