如何基本上对jqGrid的loadComplete和onSelectRow进行pre和post方法调用?

时间:2012-08-11 23:34:33

标签: javascript jquery jquery-plugins jqgrid extend

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

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

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

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

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

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

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

  4. 如果值为true,那么我想扩展onSelectRow,loadComplete方法,使jqGrid执行我的方法和onSelectRow,loadComplete方法编写的代码。

  5. 例如,我需要在preLoadComplete方法执行之前和之后执行postLoadCompleteloadComplete。同样,这也适用于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
       }
    });
    

    我尝试了很多,花了很多时间。

1 个答案:

答案 0 :(得分:1)

您正在尝试扩展$.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分别在调用loadComplete回调之前和之后的匹配元素集(即jqGridLoadComplete)上触发了两个事件jqGridAfterLoadCompletethis

所以基本上,你不能使用你的尝试。相反,我想到的唯一解决方案是使用相同的方法覆盖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);
};

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

此致。