是否可以将多个事件处理程序绑定到 JqGrid 事件而不覆盖以前的事件？

Question

例如，我在每次页面加载时调用我的默认设置并将一个函数绑定到 loadComplete 以对我的网格进行一些基本的格式化。

在某些页面上，我想同时执行其他逻辑，但如果我在网格定义中设置 loadComplete，它将覆盖我在默认设置中设置的函数。

有没有办法绑定多个处理程序，或者其他方式来执行所有必要的代码？提前致谢。

Answer 1

有一个比我在其他任何地方看到的更简单的解决方案：

// Set defaults
jQuery.extend(jQuery.jgrid.defaults, {
    loadComplete: function () {
        myCustomFunction();
    }
});

loadComplete: function() {
    // someOtherFunction();
    $.jgrid.defaults.loadComplete(); // Runs myCustomFunction()
},

Answer 2

我想你问的是当前版本的 jqGrid 中存在的一个重要问题。现在很难在 jqGrid 中实现更多的event handler。对于使用 jqGrid 的小型项目，这个问题并不重要，但如果您想要构建一些解释 jqGrid 的类，则问题可能很重要。您当前的解决方法是可以的，但有您自己理解的限制。主要问题是您可以只实现一个额外的loadCompleteEx处理程序。

我建议您使用jQuery.trigger 或更好的jQuery.triggerHandler。您可以将它与jQuery.bind 和jQuery.unbind 一起使用。以这种方式，您可以定义任意数量的事件处理程序，其工作方式类似于标准 jQuery 事件。

例如，

var grid = $("#list");

grid.bind('jqGridLoadComplete',function(e,data) {
    alert ("in first jqGridLoadComplete event handler. Called for the page " +
           data.page);
});
grid.jqGrid({
    // jqGrid parameters
    // ...
    loadComplete: function(data) {
        alert("main load complete");
        $(this).triggerHandler("jqGridLoadComplete", data);
    }
});
grid.bind('jqGridLoadComplete.jqGrid',function(e,data) {
    alert ("in second jqGridLoadComplete event handler. Called for the page " +
           data.page);
});

在第二个jQuery.bind 中，我使用了来自命名空间“jqGrid”的命名空间事件“jqGridLoadComplete.jqGrid”。因此，您可以在 jQuery 中使用您所知道（以及您需要的）关于标准事件的所有内容。

参见相应的演示here。尝试切换网格中的页面或更改排序以调用loadComplete。

我在 jqGrid 定义之后绑定第二个jqGridLoadComplete 。因为我的演示使用datatype:'local'，所以loadComplete 的第一次调用将在绑定执行之前。所以在第一个loadComplete 执行将是第二个jqGridLoadComplete 未调用事件处理程序。所以你最好在 jqGrid 定义之前绑定你的事件处理程序。在这种情况下，您可以确定该事件将始终被调用。

更新： 重要！！！。如果您使用当前版本的 jqGrid，则 不需要在 loadComplete 内显式触发 jqGridLoadComplete 事件。 jqGrid 已经为你做这件事了。上面的代码写在之前相应的功能包含在jqGrid的主代码中。答案只是描述了 如何 在 jqGrid 中实现多个事件处理程序的主要思想。写完答案后，我向 trirand 发布了一些拉取请求，并建议在 jqGrid 中实现 jQuery 事件。从 4.3.2 版本开始（参见here）jqGrid 支持事件。

Answer 3

我的hackaround解决方案：

// Global Variable in my common.js
var loadCompleteEx;

// set defaults
$.extend($.jgrid.defaults, {
     datatype: 'json',
     height: "100%",
     ...
     loadComplete: function () {
         if ($("#grid").getGridParam("reccount") === 0)
            $("#empty-grid-message").show();
         else
            $("#empty-grid-message").hide();

         // if loadCompleteEx is defined, call it at the end of loadComplete
         if (loadCompleteEx)
             loadCompleteEx();
      }
}

// In my specific page js
loadCompleteEx = function () {
    // Do more stuff after load completes
};

像魅力一样工作......这里有什么不好的做法吗？

Answer 4

如果您想在请求之前做某事，请使用 beforeRequest 函数。

您还可以将函数绑定到 gridComplete 选项。你能给出一个代码示例来展示你想要做什么吗？