带有外部搜索字段的 Jquery Datatable 服务器端分页答案

【问题标题】：Jquery Datatable Server Side Pagination With External Search field带有外部搜索字段的 Jquery Datatable 服务器端分页
【发布时间】：2017-02-15 06:38:34
【问题描述】：

我有一个显示一些数据的 Jquery Datatable，它有一个外部搜索字段。我正在尝试借助 Jquery Datatable 插件实现服务器端分页。但问题是，它有一个外部搜索字段，其中用户可以选择一个日期（基本上是月份和年份）并搜索记录。因此，每次用户选择搜索时，都需要刷新数据表。谁能帮我解决这个问题。

数据表

var LeaveDetailsTable = $('#LvReprtTable').DataTable({
    "pageLength": 5,
    "processing": true,
    "serverSide": true,"searching": false,"bLengthChange": false,
    "ajax": {
        "url": "GetLeaveDetails",
        "type": "POST",
        "datatype": "json",
        "data": function (d) {
            d.EmpId = empId;
            d.UserType = userType;
            d.Month = "1";
            d.year = "2017";
        }
    },
    "columns": [
            { "data": "_fromdate" },
            { "data": "_todate" },
            { "data": "_strLvType" },
            { "data": "_leavedurationtype" },
            { "data": "_leavedurationtype" },
            { "data": "_leavedurationtype" },
        ],
    "columnDefs": [{
        "targets": -1,
        "data": data,
        "defaultContent": "<button>Click!</button>"
    }]
    ,"language":
    {
        "processing": "<div class='row text-center waitIconDiv' id='LoadIconDiv'><img alt='Progress' src='~/Content/images/wait_icon.gif' width='50' height='50' id='imgProgLvRprt' /></div>"
    },
});

Month 和 year 可能会有所不同。

【问题讨论】：

你能展示你的控制器动作吗？
看看这篇文章：codeproject.com/Articles/1170086/…

标签： javascript jquery asp.net-mvc datatable pagination

【解决方案1】：

你需要在你想要的任何元素的任何事件中调用数据表实例上的ajax.reload()：

LeaveDetailsTable.ajax.reload();

它将使用您在data 属性中添加的新参数将数据表的状态发布到控制器操作。

您还可以查看this article (Server Side Advanced Search using JQuery DataTables)，它解释了如何使用 JQuery DataTables 将自定义参数发送到控制器操作。

【讨论】：

【解决方案2】：

为此，我建议您使用 jquery onchange 方法。例如：

$('.input-class').on('change', function () {
    $table.fnDraw();
});

这里$table 指的是您的数据表的名称，fnDraw() 是用于刷新您的表的数据表函数。显然，您需要将搜索字段中的数据添加到请求中。为此，我建议您通过以下链接：

datatables

【讨论】：