用于更新过滤器的制表符范围滑块

Question

我目前正在使用范围滑块并且卡住了，因为我无法轻松清除/更新以前的值过滤器。 这是从滑块中获取值并在表上设置过滤器的代码。

function priceFilter(values){
    table.setFilter([
    {field:"price",type:">=", value: values[0]},
    {field:"price",type:"<=", value: values[1]},
    ]);
}

function gallonFilter(values){
    table.setFilter([
    {field:"gallons",type:">=", value: values[0]},
    {field:"gallons",type:"<=", value: values[1]},
    ]);
}

这是我目前拥有的无法按预期工作的 JSfiddle 。 这是由于 setFilter 擦除了所有以前的过滤器。 所以一次只有一个滑块在工作。

这是我发现的一个“解决方案” ，它可以执行正确的行为，但是当表格在幻灯片上重新加载两次时看起来很尴尬（一次开始，一次结束）。 这是通过删除幻灯片开头的前一个过滤器，然后在末尾添加新过滤器来实现的。

如何更新这些过滤器中的值而不导致表重新加载，或者至少使其不可见？

Answer 1

setFilter函数旨在替换所有现有过滤器。 如果您只是想向现有过滤器添加另一个过滤器，那么您应该使用addFilter函数

table.addFilter("age", ">", 22);

有关如何操作过滤器的完整详细信息，请参阅过滤器管理文档