Question

我正在使用带有大量数据的jqgrid，因为过滤器耗时太长，我想在搜索之前显示一个对话框并在搜索后关闭它。

发生在我身上的事情是，当我在调试模式下运行过滤器时，我会看到打开和关闭对话框的方法在搜索之前和搜索之后被调用，但是当我运行过滤器时没有中断我可以看不到对话框，我的过滤器会等待10秒或更长时间来刷新表格，但对话框没有显示。

这是一个同步的问题吗？或者为什么我的对话框没出现？

这是我的代码：

jQuery("#mytable").jqGrid('filterToolbar',{
        searchOnEnter : false,
        stringResult : true,
        defaultSearch:'cn', 
        beforeSearch: openDialogLoading, 
        afterSearch: closeDialogLoading
    }
);  


function openDialogLoading(){
    $( "#DialogLoading" ).dialog({
            resizable: false,
            autoOpen: false,
            height: 110,
            width: 50,
            title: 'Loading...',
            modal: true,
            bgiframe: true
    });

    $( "#DialogLoading" ).dialog('open');   
}


function closeDialogLoading(){
    if ($( "#DialogLoading" ).dialog('isOpen')) {
        $( "#DialogLoading" ).dialog('close');
    }    
}

由于

Answer 1

了解网格的详细信息（您使用的选项）非常重要。使用本地分页以获得具有大量行的良好性能非常重要。我为你创建了一些你可以尝试的演示以及加载/排序/过滤的时间：

the demo1使用13列，400行，页面大小为20。
the demo2使用13列，400行，页面大小为400（无本地分页）。
the demo3使用13列，4000行，页面大小为20。
the demo4使用13列，40000行，页面大小为20。
the demo5使用13列，1000行，页面大小为1000（无本地分页）。

你可以看到网格的性能取决于页面大小。您可以使用我使用的JSFiddle演示http://jsfiddle.net/OlegKi/1rmmyeLh/来播放更多列，行和页面大小的不同值

rowNum: 20

更新：您在评论中稍后发布的一些重要问题的演示http://jsfiddle.net/1rmmyeLh/7/。修改代码，使其显示＆＃34; Loading＆＃34;带有任何信息的gif非常容易，请参阅http://jsfiddle.net/OlegKi/1rmmyeLh/8/。

我在closeDialogLoading();内部调用loadComplete并修改了beforeSearch，以便它返回true而不是false，这会阻止重新加载网格jqGrid的。另外，我手动触发reloadGrid内的setTimeout：

.jqGrid("filterToolbar", {
    beforeSearch: function () {
        var $self = $(this);
        openDialogLoading();
        setTimeout(function () {
            $self.jqGrid("setGridParam", { search: true })
                .trigger("reloadGrid", [{ page: 1 }]);
        }, 0);
        startTime = new Date();
        measureTime = true;
        return true; // SKIP filtering
    }
})

这种代码修改解决了显示＆＃34; Loading＆＃34; DIV。另一方面，我坚持认为，你遇到的主要问题是使用本地数据分页（rowNum选项）。

我想强调一点，在我看来，更好地使应用程序显示一些＆＃34; Loading＆＃34;按摩并保持缓慢的应用。您在演示rowNum: 4000中使用了4000行数据。另一方面，我只能在显示器上看到35行数据。如果我只是将rowNum从4000更改为30，我会看到性能提升大约20倍！现在你应该明确你的优先事项。人们可以长时间谈论非常愚蠢的用户难以理解寻呼机按钮的含义，但在我看来，20次性能的差异使得任何讨论都不需要。实际上，每个用户都已使用已有的寻呼机应用程序。所以我严格建议你使用本地数据分页。您将能够使用具有更大的数据集的样式（请参阅具有40000行和页面大小20的演示，在IE11中，责任更多为3倍，因为演示的责任是400行且没有分页）

使用JQgrid beforesearch和aftersearch获取加载对话框

1 个答案: