Question

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

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

Answer 1

请注意，使用.k-animation-container代替.k-filter-menu自定义过滤器菜单可能会触发其他一些kendo小部件（我认为下拉菜单就是其中之一）所以请注意这一点。

对于默认过滤器菜单.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);
        }
    }
});

Answer 2

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

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

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

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

过滤器处于活动状态时，防止刷新Kendo Grid

2 个答案: