制表器 - 独家标题过滤器 - 如何？答案

【问题标题】：Tabulator - exclusive header filters - how?制表器 - 独家标题过滤器 - 如何？
【发布时间】：2020-05-08 22:30:54
【问题描述】：

我为我们当地的动物收容所编写并支持一个小型网络应用程序，以帮助志愿者找到狗。我选择 Tabulator 是因为它具有强大的功能且易于使用，并且对我的选择感到非常满意。对于应用程序的第一个版本，我使用外部输入字段进行搜索并手动完成所有接线以支持实时搜索。

现在我正在开发 v2 并尝试使用标题过滤器。我的问题是过滤器需要独占，即使用filter1清除/禁用过滤器2和3，使用filter2清除/禁用1和3，依此类推。对于外部搜索字段，我使用 focus() 事件来执行此操作。当我尝试使用 jQuery on(focus) 委托对标题过滤器执行相同操作时，例如 table.setHeaderFilterValue("field1", "") 它不起作用；事件触发，但输入框永远不会获得焦点，所以我无法输入它。我尝试过不同的事件，比如点击；但我尝试过的任何方法都无法正常工作。

我研究了文档并为此苦苦挣扎了几个小时。考虑过hook dataFiltering()，去掉不想要的过滤器，但是不知道怎么识别要保留的过滤器，还有字段的文字问题待处理和。我确信前端工作不是我的专业领域并没有帮助，尽管到目前为止我已经做得很好。是否有一种我只是没有看到的简单或正常的方法来做到这一点？

【问题讨论】：

标签： tabulator

【解决方案1】：

作为记录，我找到了一种使用带有单个事件回调的标头过滤器进行排他过滤的方法：

        \$(document).on("focus", ".tabulator-col input[type=search]", function() {
            var hfNames = ["name", "anum", "kennel"];
            var fieldName = \$(this).closest(".tabulator-col")[0].getAttribute("tabulator-field");
            hfNames.map(function(hfN) { if (hfN != fieldName) table.setHeaderFilterValue(hfN, "") });
        });

三个 hfName 是启用过滤的列的字段名称。是的，我可以动态派生它们，但对于像这样的小应用程序来说似乎不值得。

正如我所怀疑的，关键只是更好地了解 JQuery。

【讨论】：