JQuery 数据表服务器端处理错误答案

【问题标题】：JQuery Datatables Server Side Processing BugJQuery 数据表服务器端处理错误
【发布时间】：2017-06-09 22:57:57
【问题描述】：

我正在使用最新的 Nuget 数据表包。

从 Nuget 包我使用以下两个脚本

<link rel="stylesheet" href="/Content/DataTables/css/jquery.dataTables.min.css" type="text/css" />

<script src="/Scripts/DataTables/jquery.dataTables.min.js"></script>

以下是我的客户表，它包含数据库中的 28 条记录，我正在尝试显示 10 条记录

下面是我的cshtml

<script>
    $(document).ready(function () {
        $('#clientTable').DataTable({
            "order": [[1, "asc"]],
            "serverSide": true,
            "processing": true,
            "paging": true,
            "bLengthChange": false,
            "iDisplayLength": "10",
            "ajax": {
                "url": "/Client/GetAll",
                "type": "POST",
                "dataType": "json"
            },
            "columns":
                [
                {
                    data: "ID", title: "", render: function (o) {
                        var template = "<div class=\"btn-group\"><button type=\"button\" class=\"btn btn-primary dropdown-toggle\" data-toggle=\"dropdown\"> Options <span class=\"caret\"></span></button>"
    + "<ul class=\"dropdown-menu\" role=\"menu\">"
    + "<li style=\"display: @InspectionMethods.ValidateDisplayAccessRights(AccessRights.ViewInspections)\">"
    + "<a href=\"/Client/View/" + o + "\">Edit</a>"
    + "</li>"
    + "<li class=\"divider\"></li>"
    + "<li style=\"display: @InspectionMethods.ValidateDisplayAccessRights(AccessRights.ManageEmployees)\">"
    + "    <a href=\"/Client/Inspections/" + o + "\">View Inspections</a>           "
    + "</li></ul></div>";
                        return template;
                    }
                },
                { data: "Name", title: "Company" },
                { data: "CellNumber", title: "Contact Number" }
                ]
        });
    });
</script>


<div class="row">
    <div class="col-md-12">
        <div class="portlet">
            <div class="portlet-header">
                <h3 class="pull-right">
                    <a style="display: @InspectionMethods.ValidateDisplayAccessRights(AccessRights.ManageEmployees)" href="@Url.Action("CreateClient")" class="btn btn-success pull-right">New Client</a>
                </h3>
            </div> <!-- /.portlet-header -->
            <div class="portlet-content">
                <table id="clientTable" class="table table-striped table-bordered table-hover table-highlight"></table>
            </div> <!-- /.portlet-content -->
        </div> <!-- /.portlet -->
    </div> <!-- /.col -->
</div> <!-- /.row -->

这是我的服务器端

    [HttpPost]
    public ActionResult GetAll(JQDTParams model)
    {
        using (var context = new DatabaseContext())
        {
            var clients = context.Clients.Where(model).ToList();
            var result = new
            {
                model.sEcho,
                model.draw,
                recordsFiltered = context.Clients.Count(model), // 28
                recordsTotal = context.Clients.Count(), // 28
                data = clients // 10 Items in the list
            };
            return Json(result, JsonRequestBehavior.AllowGet);
        }
    }

我得到的结果是这样的

编辑 1:) 现在显示页面。

按下第 1、2 或 3 页，它会工作并显示正确的数据。

现在，如果我转到第一页并按“下一步”，我会得到上面的结果，然后文本显示 显示 0,101 到 28 个条目，共 28 个条目，如果我再次按“下一步”转到第三页它什么也没做

【问题讨论】：

recordsFiltered 应该包含与recordsTotal 相同的数字（28），如果您不搜索表格，则会出现分页。我不熟悉 C# 实现，但您需要 total 在recordsFiltered 中搜索后获得条记录数，而不是页面上的记录数。
这可行，但会导致一个新问题我正在更新我的问题
这和 Bootstrap 有什么关系？

标签： c# asp.net datatables bootstrap-4

【解决方案1】：

发现问题

似乎 jquery.Datatables 将 "iDisplayLength" 处理为字符串而不是 int，简单的更改

 $(document).ready(function () {
        $('#clientTable').DataTable({
            "order": [[1, "asc"]],
            "serverSide": true,
            "processing": true,
            "paging": true,
            "bLengthChange": false,
            "iDisplayLength": 10, //Here was the problem

【讨论】：