javascript - 一般如何对 jqGrid 的 loadComplete 和 onSelectRow 进行 pre 和 post 方法调用?

标签 javascript jquery jquery-plugins jqgrid extend

我的网格有特殊的实现。
为此,我在jqGridonSelectRowloadComplete方法中编写了一些代码。

onSelectRow 中,我需要更新全局数组,在 loadComplete 方法中,我必须访问全局数组并需要在 jqGrid 中进行一些操作。

到那时我就没事了。我已经这样做了。 现在我想以通用的方式扩展这两个方法(其他网格可以使用它而无需编写任何代码)。

为此,我想到了以下步骤。

  1. 我想使用 jqGrid.js 在我的 html 中添加一个新的 js(例如:jquery.jqGrid.additional.js)

  2. 我想通过jqGrid的数据数组分配我的全局变量

  3. 在这个js中我想检查网格的多选值

  4. 如果值为 true,那么我想扩展 onSelectRow、loadComplete 方法,以便 jqGrid 执行我的方法以及 onSelectRow、loadComplete 方法中编写的代码。

例如,我有 preLoadCompletepostLoadComplete ,它们需要在 loadComplete 方法执行之前和之后执行。同样,这也适用于 onSelectRow 方法。

我在 jquery.jqGrid.additional.js 中编写了以下代码,然后在 jqGrid 加载后没有收到警报 (1)、警报 (2)。

它只执行jqGrid的loadComplete方法中编写的代码。

var oldLoadComplete = $.fn.jqGrid.loadComplete;

$.jqGrid.extend({
   loadComplete: function (){
      var ret;
      // do someting before
      alert(1);

      ret = oldLoadComplete.call (this);

      // do something after
      alert(3);

      return ret; // return original or modified results
   }
});

我对此进行了很多尝试并花了很多时间。

最佳答案

您正在尝试扩展$.jqGrid,而不是$.fn.jqGrid。在第一行中,这意味着 $.jqGrid 甚至不存在,并且所有元素都无法访问修改后的 .jqGrid 插件,但仍使用默认值。

尽管我尝试使用"new"追加方法扩展 $.fn ,但没有成功。您可能必须显式覆盖这些方法。我可以想象 jQuery 本身有一些安全例程,并且在 $.extend 方法中内置了一些插件。

var oldLoadComplete = $.fn.jqGrid.loadComplete;

$.fn.jqGrid.loadComplete = function( ) {
    alert('pre');
    var ret = oldLoadComplete.apply(this, arguments); // In case any arguments will be provided in future.
    alert('post');
    return ret;
};

编辑:

忘掉这一切吧。这是无关紧要的。在 GitHub 上查看了一下 jqGrid 的源代码后,很明显 jqGrid 甚至没有使用像 $.fn.jqGrid.loadComplete 这样的东西。那是你自己编造出来的。相反,它创建另一个对象,该对象提供可能的属性和默认值的列表,然后由自定义默认值覆盖,最后由您调用 jqGrid 时传入的函数参数覆盖。

我发现 jqGrid 在调用之前和之后在您的一组匹配元素(即 this)上触发两个事件 jqGridLoadCompletejqGridAfterLoadComplete分别到 loadComplete 回调。

所以基本上,你不能使用你的尝试。相反,我想到的唯一解决方案是使用相同的方法覆盖 jqGrid“构造函数”(即 $.fn.jqGrid),并将监听器应用于 this ,例如所以:

var oldJqGrid = $.fn.jqGrid;

$.fn.jqGrid = function( ) {
    this.on('jqGridLoadComplete', function( jqEvt ) {
            alert('Pre');
        })
        .on('jqGridAfterLoadComplete', function( jqEvt ) {
            alert('Post');
        });
    return oldJqGrid.apply(this, arguments);
};

关于你的多选...我不知道你在说什么。我自己的时间非常有限,暂时不得不拒绝进一步的帮助。

真诚的。

关于javascript - 一般如何对 jqGrid 的 loadComplete 和 onSelectRow 进行 pre 和 post 方法调用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11918519/

相关文章:

javascript - 使用 JavaScript 函数刷新 Bootstrap-Table 表

javascript - 我无法启用选择

javascript - jQuery 插件未从 AJAX 返回的 JSON 返回结果

css - caroufredsel 在 chrome 中效果不佳

javascript - 传单鼠标悬停弹出数组列表

javascript - 我如何修复 :hover on iPhone if there is no <a> element?

javascript - 在 AngularJS 服务中使用 Promise

PHP 脚本和 HTML - 这适用于 Firefox 和 Chrome,但不适用于 IE

jquery - 覆盖从 val() 检索的变量

javascript - JQuery Cycle 插件 - 可变/调整高度