全局JavaScript变量无法通过DataTable Ajax传递至MVC控制器

问题核心在于你当前的ajax.data是静态赋值，DataTable初始化时就把window.searchValue的当时值（初始为undefined）绑定到请求参数里，后续点击按钮更新window.searchValue后，请求依然会使用初始化时的旧值，导致控制器接收不到最新输入框内容。

正确实现方式 #

把ajax.data改成函数形式，每次发起请求时动态获取输入框的最新值：

$(document).ready(function () {
    function updateSearchValuesBeforeSend() {
        // 触发DataTable重新加载，此时会调用ajax.data的函数获取最新参数
        $('#work-order-table').DataTable().draw();
    }

    $("#submitButton").on('click', function (event) {
        updateSearchValuesBeforeSend();
    });

    var Table = $('#work-order-table').dataTable({
        processing: true,
        serverSide: true,
        scrollX: true,
        scrollResize: true,
        scrollY: 600,
        scrollCollapse: true,
        bStateSave: true,
        fnStateSave: function (oSettings, oData) {
            localStorage.setItem('work-order-table', JSON.stringify(oData));
        },
        fnStateLoad: function (oSettings) {
            return JSON.parse(localStorage.getItem('work-order-table'));
        },
        ajax: {
            url: '@Url.Action("FilterList")',
            method: 'POST',
            // 改为函数，每次请求时动态返回参数
            data: function(d) {
                // 把自定义参数合并到DataTable默认的请求参数中
                d.search_value = $("#searchValue").val();
                return d;
            }
        }
    });
});

额外注意事项 #

• 确保你的ViewModel中的属性名和请求参数名完全一致（比如search_value对应ViewModel里的public string Search_Value { get; set; }，或者用[Bind(Prefix = "search_value")]标记）
• 不要用fnFilter触发搜索，它主要用于DataTable内置的全局搜索，直接调用draw()方法会触发完整的服务器端请求，同时带上你自定义的参数
• 测试时可以在浏览器开发者工具的Network面板中查看POST请求的Form Data，确认search_value是否已正确携带

内容的提问来源于stack exchange，提问作者Nima Sarrafzadeh