DataTable Ajax请求时隐藏表单控件未初始化问题排查

咱们先拆解你遇到的核心问题：

问题1：重复初始化DataTable导致参数固化 #

你在下拉框的change事件里反复调用table.DataTable({ ajax: { ... } })，这相当于每次选值都重新初始化一次DataTable。更关键的是，这里的data: {oid: $('#oid').val()}是初始化那一刻的静态值——哪怕之后#oid的值更新了，DataTable的ajax请求参数也不会自动同步，因为这个配置在初始化时就固定死了。

问题2：DataTable实例引用混乱 #

你初始化时用的是var table = $('#example').dataTable()（小写dataTable），这返回的是jQuery对象，而非DataTable的核心实例。之后你又调用table.DataTable()（大写DataTable），本质是在重复创建实例，导致配置被覆盖、实例引用混乱，最终请求参数无法正确更新。

正确实现方案 #

1. 修正DataTable初始化方式

先把初始化代码改成直接获取DataTable实例的写法，同时用动态函数返回请求参数：

// 用大写DataTable()直接获取实例，ajax的data用函数动态返回
var table = $('#example').DataTable({
  ajax: {
    data: function() {
      // 每次发起ajax请求时，都会重新读取当前#oid的最新值
      return { oid: $('#oid').val() };
    }
  }
});

这种写法的好处是，每次请求都会实时拉取#oid的当前值，彻底解决参数固化问题。

2. 简化下拉框change事件逻辑

只需要更新隐藏控件的值，再触发DataTable重新加载即可：

$('#objs').change(function() {
  // 直接给隐藏控件赋值，写法更简洁
  $('#oid').val(this.value);
  // 调用实例的ajax.reload()，触发带最新参数的请求
  table.ajax.reload();
});

为什么之前会提交空的oid？ #

你之前的代码里，重复初始化DataTable时的data参数是瞬间读取的旧值，后续的ajax.reload()又因为实例引用混乱，没有使用更新后的参数。而用动态函数返回参数+直接操作实例的方式，就能保证每次请求都携带最新的oid值。

内容的提问来源于stack exchange，提问作者Interface Unknown