Question

我已成功设法让YADCF在所有方面都使用daterangepicker：我无法直接触发daterangepicker'application'按钮的过滤操作。

Click here for screenshot of daterangepicker with YADCF.

如果我设置了日期范围然后手动点击输入字段（.yadcf_daterangepicker），那么一切都很顺利，但我无法使用JS以编程方式执行此操作。有人可以帮忙吗？

我尝试过以下操作但不起作用：

$(".applyBtn.btn").click(function() {
    var e = jQuery.Event('keydown', { which: 13 });
    $(".yadcf_daterangepicker").trigger(e);
});

如果我在那里发出警报，它会触发，所以我知道正在捕获“应用”按钮点击 - 它正在将该点击转移到我需要帮助的输入字段。

更新： click here for a JSFiddle example

更新2 ：在Daniel的帮助下，我使用了以下代码：

$(".applyBtn").click(function() {
    var start = $('.daterangepicker').find('input[name="daterangepicker_start"]').val();
    var end = $('.daterangepicker').find('input[name="daterangepicker_end"]').val();
    yadcf.exFilterColumn(table, [[1, start + ' - ' + end]]);
});

...在updated fiddle上完美运行，因为它填充了过滤器字段并对过滤器进行了操作，但在我的真实服务器端脚本上使用相同的代码填充但不会对过滤器执行操作。我使用所有最新的依赖项，完全按照小提琴，以相同的顺序，在所有其他方面，一切都按预期工作。

我花了几个小时来攻击我复杂的应用程序，除了对小提琴的依赖之外什么也没有加载，但仍然没有快乐。我尽可能多地将我的代码复制到一个新的小提琴（不是服务器端）并且它有效。所以我最终手动将静态数据数组编码到我的应用程序并删除了serverSide：true，processing：true和ajax：{}然后突然一切都按预期工作。

结论：服务器端JS或进程中的某些内容阻止了yadcf.exFilterColumn（）在单击包装器内时按预期工作。任何想法？

更新3 ：在Daniel的进一步帮助下，我使用了以下代码，这就是诀窍：

$(".applyBtn").click(function() {
    var start = $('.daterangepicker').find('input[name="daterangepicker_start"]').val();
    var end = $('.daterangepicker').find('input[name="daterangepicker_end"]').val();
    //notice the third parameter *true* in exFilterColumn
    yadcf.exFilterColumn(table, [[1, start + ' - ' + end]], true); 
});

Answer 1

关于如何以编程方式触发yadcf的具体问题 - 使用yadcf.exFilterColumn api，您也可以使用yadcf.exGetColumnFilterVal。

在你的例子中：

$(".applyBtn").click(function() {
    var e = jQuery.Event('keydown', {
      which: 13
    })
    yadcf.exFilterColumn(table, [[1, yadcf.exGetColumnFilterVal(table,1)]]);  
  });

但我建议使用可以与jquery-ui / bootstrap-datetimepicker（https://github.com/Eonasdan/bootstrap-datetimepicker）/ bootstrap-datepicker（https://github.com/uxsolutions/bootstrap-datepicker）集成的range_date过滤器

阅读更多文档。

更新

您必须将第三个参数true添加到exFilterColumn

yadcf.exFilterColumn(table, [[1, yadcf.exGetColumnFilterVal(table,1)]], true);

希望能更新有关此文档的文档......

如何使用jQuery以编程方式触发YADCF过滤器输入？

1 个答案: