如何用jQuery程序化触发YADCF筛选输入？daterangepicker触发难题

我之前也碰到过一模一样的问题，给你几个亲测有效的解决方案：

1. 直接在daterangepicker回调中调用YADCF筛选方法 #

这是最可靠的方式，跳过模拟输入框事件，直接让Apply按钮触发YADCF的官方筛选函数：

// 假设你的表格ID是data-table，日期列索引是0
$('.yadcf_daterangepicker').daterangepicker({
  applyButtonClasses: 'btn btn-sm btn-primary',
  locale: {
    applyLabel: '应用筛选',
    format: 'YYYY-MM-DD'
    // 其他你的daterangepicker配置
  }
}, function(start, end, label) {
  // 调用YADCF的外部筛选方法，传入日期范围
  yadcf.exFilterColumn($('#data-table'), [[0, `${start.format('YYYY-MM-DD')} - ${end.format('YYYY-MM-DD')}`]]);
});

原理：daterangepicker的回调函数会在点击Apply按钮后触发，我们直接把选中的日期范围传给YADCF的exFilterColumn方法，强制触发筛选。

2. 模拟输入框的Change事件（兼容旧版场景） #

如果第一种方法不适用，你可以尝试手动触发YADCF监听的输入框变化事件。注意要加个小延迟，确保daterangepicker已经更新了输入框的值：

// 用事件委托绑定动态生成的Apply按钮
$(document).on('click', '.applyBtn.btn', function() {
  setTimeout(() => {
    $('.yadcf_daterangepicker').trigger('change');
  }, 100);
});

为什么要加延迟？因为daterangepicker点击Apply后，会先执行自身的更新输入框逻辑，立即触发change事件可能会拿到旧值。

3. 检查YADCF初始化配置 #

先确认你的YADCF初始化代码中，日期列的配置是否正确，尤其是filter_type和日期格式：

yadcf.init($('#data-table'), [
  {
    column_number: 0,
    filter_type: 'daterangepicker',
    date_format: 'yyyy-mm-dd',
    // 确保daterangepicker的配置和YADCF的格式匹配
    daterangepicker_options: {
      locale: {
        format: 'YYYY-MM-DD'
      }
    }
  }
]);

如果YADCF的日期格式和daterangepicker输出的格式不匹配，也会导致筛选不生效。

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