是什么导致jqgrid事件多次触发?

时间:2019-08-16 00:38:01

标签: jqgrid

我们的jqgrid是在initgrid函数中配置的,该函数称为ready处理程序的最后一条语句。由于某种原因,gridcomplete函数被多次调用。使用下面的代码,它被调用了两次,但是已经被调用了3次。两次都够糟糕的。在多次执行它之后,我看不到是什么触发了gridComplete函数的第二次执行。

当我在gridComplete的开头点击调试器时,每次调用堆栈实际上都是相同的,唯一的区别是在jqgrid中调用了“ L”:

callstacks:

任何人都知道为什么会这样吗?我们正在ASP.net MVC应用程序中使用免费版本4.13。

$(function(){
    ....
    initGrid();
}

function initGrid(){
$gridEl.jqGrid({
        xhrFields: {
            cors: false
        },
        url: "/IAConsult/GetWorkFlowIARequests",
        postData: {
            showAll: showAllVal,
            role: role,
            IsIAArchitect: userIsIA
        },
        datatype: "json",
        crossDomain: true,
        loadonce: true,
        mtype: 'GET',
        sortable: true,
        viewrecords: true,
        pager: '#workFlowIAGridPager',
        multiselect: true,
        rowNum: 50,
        autowidth: true,
        colModel: [...],
        beforeSelectRow: function (rowid, e) {
            var $myGrid = $(this),
                i = $.jgrid.getCellIndex($(e.target).closest('td')[0]),
                cm = $myGrid.jqGrid('getGridParam', 'colModel');
            return (cm[i].name === 'cb');
        },
        jsonReader: {
            repeatitems: true,
            root: "IAConsultWorkflowRequestsList"
        },
        beforeSubmitCell: function (rowid, name, value, iRow, iCol) {
            return {
                gridData: gridData
            };
        },
        serializeCellData: function (postdata) {
            return JSON.stringify(postdata);
        },
        gridComplete: function () {
            console.log('grid complete');
            let rowIDs = $gridEl.getDataIDs();
            let inCompleteFlag = false;
            let dataToFilter = $gridEl.jqGrid('getGridParam', 'lastSelectedData').length == 0
                ? $gridEl.jqGrid("getGridParam", "data")
                : $gridEl.jqGrid('getGridParam', 'lastSelectedData');
            let $grid = $gridEl, postfilt = "";
            let localFilter = $gridEl.jqGrid('getGridParam', 'postData').filters;
            let columnNames = columns.split(',');

            $('.moreItems').on('click', function () {
                $.modalAlert({
                    body: $(this).data('allitems'),
                    buttons: {
                        dismiss: {
                            caption: 'Close'
                        }
                    },
                    title: 'Design Participants'
                });
            });

            rowCount = $gridEl.getGridParam('records');
            gridViewRowCount = rowCount;

            let getUniqueNames = function (columnName) {
                ...             };

            let buildSearchSelect = function (uniqueNames) {
                var values = {};
                values[''] = 'All';
                $.each(uniqueNames,
                    function () {
                        values[this] = this;
                    });
                return values;
            };

            let setSearchSelect = function (columnName) {
                ...

            };

            function getSortOptionsByColName(colName) {
                ...
            }



            $grid.jqGrid("filterToolbar",
                { stringResult: true, searchOnEnter: true });


            if (localFilter !== "" && localFilter != undefined) {
                globalFilter = localFilter;
            }

            let grid = $gridEl.jqGrid("setGridParam",
                {
                    postData: {
                        "filters": globalFilter,
                        showAll: showAllVal,
                        role: role,
                        IsIAArchitect: userIsIA
                    },
                    search: true,
                    forceClientSorting: true
                });

            //grid.trigger("reloadGrid");
            //Ending Filter code


            for (i = 0; i < columnNames.length; i++) {

                var htmlForSelect = '<option value="">All</option>';
                var un = getUniqueNames(columnNames[i]);
                var $select = $("select[id='gs_workFlowIAGrid_" + columnNames[i] + "']");
                for (j = 0; j < un.length; j++) {
                    val = un[j];

                    htmlForSelect += '<option value="' + val + '">' + val + '</option>';
                }
                $select.find('option').remove().end().append(htmlForSelect);
            }
            debugger;
        },

        // all grid parameters and additionally the following
        loadComplete: function () {
            $gridEl.jqGrid('setGridWidth', $(window).width(), true);
            $gridEl.setGridWidth(window.innerWidth - 20);
        },

        height: '100%'
    });

1 个答案:

答案 0 :(得分:0)

我个人几乎从不使用gridComplete回调。它存在于免费的jqGrid中,主要是为了向后兼容。建议您阅读the old answer,其中介绍了gridCompleteloadComplete之间的区别。

一些其他建议:在回调内部注册事件很危险(请参阅$('.moreItems').on('click', ...)。如果您需要对网格内的单击进行一些操作,那么我建议您使用beforeSelectRow。许多事件(包括click事件)都支持事件冒泡,并且网格内部未处理的单击将冒泡到父<table>元素。您已经使用beforeSelectRow回调,而e.target为您提供了有关单击元素的完整信息。

我建议您另外不要使用setGridParam方法,这会降低性能。默认情况下,setGridParam方法对所有内部参数进行深拷贝,包括data之类的包含数组,它们可能很大。这样,相对于setGridParam更改一个小参数可能会很昂贵。如果需要修改jqGrid的参数,则可以使用getGridParam 附加参数来获取内部对象的 reference ,该对象包含所有jqGrid参数。之后,您可以使用参数对象访问以读取或修改jqGrid的参数。有关小代码示例,请参见the answer

相关问题