Datatables+YADCF+Select2：下拉选择后设置默认值及Ajax自动填充问题

问题1：选择下拉框后为Select2字段设置默认选中值 #

当然可以实现！核心思路是监听目标下拉框的change事件，在事件触发后调用Select2的API来设置默认值。这里要注意两点：一是确保Select2的选项已经加载完成（如果是动态加载的话），二是正确调用Select2的方法来触发选中状态更新。

举个实际代码例子：

// 假设你的主下拉框ID是main_filter，目标Select2的ID是car_select2
$('#main_filter').on('change', function() {
  // 先获取选中值对应的默认Select2选项值，这里可以根据业务逻辑动态获取，比如从后端接口拿
  const defaultCarValue = 1; // 示例值，实际可通过Ajax请求获取
  
  // 设置Select2的选中值并触发change事件，确保UI同步
  $('#car_select2').val(defaultCarValue).trigger('change');
});

如果你的Select2选项是通过Ajax动态加载的，建议在设置默认值前先确保选项已加载完成，比如可以在Select2的select2:loaded事件回调里处理，或者在主下拉框的change事件中先请求Select2的选项，再设置默认值。

问题2：通过含default标识的Ajax数据自动填充Select2选中值 #

完全可行！你只需要在Ajax请求成功后，遍历返回的数据集，筛选出default: true的项，然后将其key值设置为Select2的选中值即可。结合YADCF的配置，你可以在初始化Select2过滤器的时候处理这个逻辑。

示例代码如下：

// YADCF中配置Select2过滤器的示例
yadcf.init(table, [
  {
    column_number: 2, // 对应表格列索引
    filter_type: 'select2',
    select_type: 'select2',
    data: function(column) {
      // 发起Ajax请求获取数据
      return $.ajax({
        url: '/api/get-car-options',
        type: 'GET',
        dataType: 'json',
        success: function(data) {
          // 筛选出default为true的选项
          const defaultOption = data.find(item => item.default === true);
          if (defaultOption) {
            // 设置Select2选中值
            $(column).val(defaultOption.key).trigger('change');
          }
        },
        error: function() {
          // 针对Heroku休眠的情况，加入请求重试逻辑
          setTimeout(() => {
            // 重新刷新过滤器数据
            $(column).data('yadcf-filter').refreshFilter();
          }, 3000);
        }
      });
    },
    select2_options: {
      placeholder: "选择车辆",
      allowClear: true
    }
  }
]);

另外针对Heroku免费计划的休眠问题，除了在error回调里加入重试逻辑，还可以在页面初始化时发起一个轻量的预请求，提前唤醒Heroku服务，减少后续请求的延迟，避免因为服务休眠导致默认值设置失败。

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