过滤器处于活动状态时防止刷新剑道网格答案

【问题标题】：Prevent refreshing Kendo Grid when filter is active过滤器处于活动状态时防止刷新剑道网格
【发布时间】：2023-03-30 00:14:01
【问题描述】：

我有一个每 5 秒刷新一次 Kendo Grid 的 javascript 方法，我想防止此功能在过滤器对话框打开或过滤器处于活动状态时不起作用。可能吗？如果过滤器处于活动状态，是否可以使用任何事件？

//For refreshing grid periodically
$(document).ready(function () {
    var refreshId = setInterval(function () {
        var grid = $("#eventGrid").data("kendoGrid");
        $("#eventGrid").data("kendoGrid").dataSource.read();
    }, 5000);
});

【问题讨论】：

尝试使用 binidng setInterval 在网格dataBound 事件上刷新，然后在filterMenuInit 事件上清除它，然后在关闭过滤器菜单时（我认为您必须再次为此创建自定义事件）在网格dataBound 上绑定刷新并手动刷新。 docs for filterMenuInit
非常感谢您的帮助。您可以发布一个示例作为答案吗？
也许稍后，我现在很忙。但是您可以使用grid.bind('dataBound' , addRefreshToGrid) 将事件处理程序动态绑定到网格，然后使用grid.unbind('dataBound' , addRefreshToGrid) 将其删除，addRefreshToGrid 是处理程序函数引用。对于所有其他事件，您以相同的方式附加处理程序。 gl
@Drops 非常感谢，但我真的无法解决问题。如果您有时间，可以看看并发布一个示例吗？

标签： javascript jquery kendo-ui kendo-grid kendo-asp.net-mvc

【解决方案1】：

请注意，使用.k-animation-container 而不是.k-filter-menu 用于自定义过滤器菜单可能会在其他一些剑道小部件上触发（我认为下拉菜单就是其中之一），因此请注意这一点。

对于默认过滤器菜单.k-animation-container .k-filter-menu 将完成这项工作。对于自定义过滤器，可以使用一些自定义钩子/选择器，例如.k-animation-container .custom-filter-menu，然后检查它是否可见。

$(function(){
    var grid = $("#grid").data('kendoGrid'),
        gridRefresh = setInterval(refreshGrid, 5000),
        filterCheck;

    grid.bind('filterMenuInit', onFilterMenuInit);

    function onFilterMenuInit(){
        // console.log('Filter Menu opened');
        // console.log('Grid Refresh removed');
        clearInterval(gridRefresh);
        // console.log('Filter Check added');
        filterCheck = setInterval(filterInterval, 1000);
    }

    function refreshGrid(){
        //console.log('Grid Refreshed');
        grid.dataSource.read();
    }

    function filterInterval(){
        // console.log('Filter Check');
        //    '.k-animation-container .k-filter-menu' for default menus
        // or '.k-animation-container .custom-filter-menu' for custom menus
        if(!$('.k-animation-container').is(":visible")){
            // console.log('Filter Check removed');
            clearInterval(filterCheck);
            // console.log('Grid Refresh added');
            gridRefresh = setInterval(refreshGrid, 5000);
        }
    }
});

【讨论】：

非常感谢，已投票+ 但是，它仅适用于日期过滤器 (DateTimePicker)，不适用于文本字段的过滤器。如何解决？
我不知道，在我的本地网格中，它适用于每个过滤器，但我再次使用默认过滤器选项，而不是自定义，也许这就是问题。但总的来说，从这里开始，为了涵盖自定义过滤器菜单，您可以创建自定义 onFilterMenuInit 实现来检查 $('.k-animation-container').is(":visible") 是否存在。这样，如果打开过滤器菜单，您将始终收到通知。只需在我的回答中创建类似filterInterval 的功能即可为您执行此操作。
太完美了 :) 在 filterInterval() 方法中将 .k-filter-menu 更改为 .k-animation-container 后，它适用于每个过滤器。您可以更新它，以便其他人也能正确使用它。再次感谢投票+++

【解决方案2】：

另一种方法——但不确定它有多可靠——是检查过滤器的 DOM 元素。过滤器弹出窗口是在网格包装器的同一个父级中创建的，而不是在其中。所以你可以检查它的元素以及它是否可见。

使用这些选择器，您可以检查过滤器弹出元素：

$(grid.element).parent().find(".k-animation-container:visible .k-filter-menu");

如果返回任何元素，则打开过滤器。查看this demo（并查看控制台）。

【讨论】：