本文详解如何在使用 datatables 的 `serverside: true` 模式时，正确将用户输入的搜索值（如文本框内容）通过 ajax 动态传入 mvc 控制器，避免因执行时机错误导致参数为 null 的常见问题。
在使用 DataTables 实现服务器端分页（serverSide: true）时，一个高频痛点是：无法将页面上动态输入的搜索条件（例如 ）可靠地随每次 AJAX 请求一并提交到后端。你可能会发现：虽然 $("#searchValue").val() 在控制台打印出正确值，但控制器接收到的对应参数始终为 null。
根本原因在于：你当前的写法
data: {
'search_value': window.searchValue
}是在 DataTables 初始化时一次性求值并固化的——此时 window.searchValue 还未被赋值（或仍为 undefined），后续修改该变量不会自动同步到 AJAX 请求中。即使你点击按钮更新了 window.searchValue，DataTables 并不会重新读取这个字段。
✅ 正确解法：使用 data 作为函数，确保每次发起 AJAX 请求前实时获取最新值：
var Table = $('#work-order-table').DataTable({ // 注意：推荐使用 DataTable() 而非已废弃的 dataTable()
processing: true,
serverSide: true,
scrollX: true,
scrollY: 600,
scrollCollapse: true,
stateSave: true, // 替代已废弃的 bStateSave
stateSaveCallback: function(settings, data) {
localStorage.setItem('work-order-table', JSON.stringify(data));
},
stateLoadCallback: function(settings) {
return JSON.parse(localStorage.getItem('work-order-table'));
},
ajax: {
url: '@Url.Action("FilterList")',
method: 'POST',
data: function(d) {
// ✅ 每次请求前动态注入参数
d.search_value = $("#searchValue").val() || '';
d.name_value = $("#nameList").val() || '';
d.date_value = $("#dateValue").val() || '';
// 可选：保留 DataTables 默认参数（如 draw、start、length 等）
// d 已包含这些，无需额外处理
}
},
// 其他列配置...
});? 关键要点说明：
- data 接收一个函数，DataTables 会在每次 AJAX 请求发出前调用它，并将默认参数对象 d 传入；你只需在此函数内为 d 添加自定义属性即可；
- 不再依赖全局变量或预存值，彻底规避“值已过期”问题；
- 使用 || '' 防止 undefined 或 null 被序列化为字符串 "undefined"，提升后端模型绑定健壮性；
- 注意：fnFilter() 是客户端过滤方法，与服务器端分页无关，此处无需调用（删除 Table.fnFilter(this.value) 可避免混淆）；
- 建议升级至 DataTables 1.10+ API（如 DataTable()、stateSave），旧版 dataTable() 和 fnStateSave 已弃用。
最后，在 MVC 控制器中，确保 Action 方法签名能接收这些额外参数：
public ActionResult FilterList(int draw, int start, int length,
string search_value = "",
string name_value = "",
string date_value = "")
{
// 构建查询逻辑，使用 search_value 等进行数据库过滤
// 返回 JsonResult 包含 data、recordsTotal、recordsFiltered、draw
}这样，用户点击搜索按钮后触发的每一次 DataTables 刷新（包括分页、排序、重绘），都将携带最新的搜索值，实现真正响应式的服务器端筛选。
