Question

我已经玩了很长时间的jqGrid，但从未深入了解有关性能的细节我没有使用内置的jqGrid搜索表单，因为我更喜欢拥有自己的工具栏，用户输入他/她想要过滤的一些数据。

我总是把我的网格包裹在一个函数中：

$(document).ready(function () {

    var myGrid = jQuery("#MyGrid");

    $("#cmdSearch").bind('click', function (e) {
        myGrid.GridUnload();
        LoadMyGrid($("#Filter1").val(), $("#Filter2").val())
    });

    function LoadMyGrid(param1, param2) {
        myGrid.jqGrid({
            url: 'myUrl',
            postData: { Param1: param1, Param2: param2 },
            datatype: 'json',
            mtype: 'POST',
            colNames: ['Column1', 'Column2'],
            colModel: [
                       { name: 'colum1', index: 'colum1', sortable: true, width: 100 },
                       { name: 'colum2', index: 'colum2', sortable: true, width: 100 }
                      ],
            pager: $('#MyPager'),
            rowList: [10, 50, 100],
            rowNum: 10,
            viewrecords: false,
            shrinkToFit: false,
            rownumbers: true,
            hidegrid: false,
            emptyrecords: "No records."
        });
    }
});

并在重新创建之前卸载它（GridUnload）。我想知道这是否是最好的方法，或者可能存在一些性能/内存问题？

Answer 1

示例中GridUnload()的使用并不是最好的方法。我会把你的代码重写为以下

$(document).ready(function () {
    var myGrid = jQuery("#MyGrid");

    myGrid.jqGrid({
        url: 'myUrl',
        postData: {
            Param1: function() { return $("#Filter1").val(); },
            Param2: function() { return $("#Filter2").val(); }
        },
        datatype: 'json',
        mtype: 'POST',
        colNames: ['Column1', 'Column2'],
        colModel: [
            { name: 'colum1', index: 'colum1', sortable: true, width: 100 },
            { name: 'colum2', index: 'colum2', sortable: true, width: 100 }
        ],
        pager: '#MyPager',
        rowList: [10, 50, 100],
        rowNum: 10,
        viewrecords: false,
        shrinkToFit: false,
        rownumbers: true,
        hidegrid: false,
        emptyrecords: "No records."
    });

    $("#cmdSearch").click(function() {
        myGrid.trigger('reloadGrid',[{page:1}]);
    });
});

在代码中，我使用了使用函数的概念作为postData的属性，我在其中描述了here。可以减少myGrid.trigger('reloadGrid');的“点击”手柄。在所有网格重新加载的情况下（例如在排序或分页时）将使用来自$("#Filter1")和$("#Filter2")控件的当前值。网格本身不会被破坏和重新创建。而不是只重新加载网格数据。关于reloadGrid的不同附加参数，请参阅here。

从pager: $('#MyPager')到pager: '#MyPager'的细微变化我想要一点评论。如果你看the jqGrid source code，你会发现

if(typeof ts.p.pager == "string") {if(ts.p.pager.substr(0,1) !="#") {
    ts.p.pager = "#"+ts.p.pager;}
} else { ts.p.pager = "#"+ $(ts.p.pager).attr("id");}

因此，如果您使用pager形式的$('#MyPager')参数，则将其“标准化”为“#MyPager”。读完本文后，我只使用pager: '#MyPager'语法。

jqGrid和搜索过滤器。重新填充数据的最佳方式

1 个答案: