3

这几天我找不到正常的答案。我希望有人能帮助我。

我在 Zend Framework 应用程序中使用 jqGrid。我希望我的应用程序中的网格可以内联编辑(http://www.trirand.com/jqgridwiki/doku.php?id=wiki:inline_editing)。当我不使用 ZF 并且我自己编写 jqGrid 代码(java 脚本)时 - 内联编辑工作正常。但是在使用 ZF 类“Bvb_Grid_Deploy_JqGrid”并部署网格时,ZF 会自己生成 java 脚本。我找不到正确插入js函数“onSelectRow”的ZF方法的问题。尝试使用“$grid->jqAddOnLoad($js);” 在 ZF 控制器中,但这个 java 脚本代码看起来不像示例中那样,然后网格根本没有正常加载。一定是:

jQuery().ready(function (){
  jQuery("#jqg_RentAsset").jqGrid(
  {
    height: 250,
     ...
    multiselect: true,
    caption: "Manipulating Array Data",
    onSelectRow: function(id)
    {
      alert(id);
    }
  });

但是会发生:

$(document).ready(function() {
  jQuery("#jqg_RentAsset").jqGrid(
  {
    onSelectRow: function(id)
    {
      alert(id);
    }
  });
  jQuery("#jqg_RentAsset").jqGrid(
  {
    "height":"250",
      ...
  });

也许有人知道我必须在 ZF Controller 中使用什么方法,或者我需要编写 java 脚本有多么不同?

4

2 回答 2

2

我自己不使用 Zend Framework。所以我的建议很常见,它们独立于您使用的框架。

在下面的示例中,我将展示如何onSelectRow在网格上动态设置以实现对行选择的内联编辑。我想网格中已经存在其他必需的设置,如editable: true属性colModel和选项。editurl所以我只显示onSelectRow动态的设置。

第一种方法是使用setGridParam设置onSelectRow回调。对应的demo使用如下代码:

$(function () {
    var $grid = $("#list"),
        editingRowId,
        myInlineEditingOptions = {
            keys: true,
            oneditfunc: function (id) { editingRowId = id; },
            afterrestorefunc: function () { editingRowId = undefined; },
            aftersavefunc: function () { editingRowId = undefined; }
        };

    $grid.jqGrid({
        datatype: 'local',
        ....
        editurl: 'clientArray'
    });

    // now we set or change onSelectRow callback AFTER jqGrid is created
    $grid.jqGrid('setGridParam', {
        onSelectRow: function (id) {
            if (id !== editingRowId) {
                if (typeof editingRowId !== "undefined") {
                    // save previously editing row
                    //$(this).jqGrid("saveRow", editingRowId, myInlineEditingOptions);

                    // discard changes from the previously editing row
                    $(this).jqGrid("restoreRow", editingRowId, myInlineEditingOptions);
                }
                // start inline editing. The user should save the row by pressing ENTER
                $(this).jqGrid("editRow", id, myInlineEditingOptions);
            }
        }
    });
});

在上述情况下,重要的是要提到

  1. 我们可以在创建 jqGridonSelectRow 之后设置(或更改)。
  2. 它只能是网格中的一个 onSelectRow回调。设置新的onSelectRow回调覆盖现有的回调。

最后一个限制可能非常困难。例如,您不能实现一些onSelectRow应该为项目中的所有网格执行的默认操作,并onSelectRow为一些额外的特定操作使用附加操作。这是引入类 jQuery 事件的主要原因,这些事件可以非常接近回调的形式使用。下一个示例演示了该技术。

下一个演示与上一个完全一样,但它使用jqGridSelectRow事件而不是onSelectRow回调。新技术有两个重要的优点

  1. 可以在创建 jqGrid 之前或之后设置jqGridSelectRow事件处理程序。如果使用jQuery.bind绑定事件处理程序,那么将被转换为网格的元素应该存在。如果使用更慢的jQuery.delegatejQuery.livejQuery.on(最后一个从 jQuery 1.7 开始存在),则可以随时绑定事件处理程序。<table>
  2. 可以设置多个 jqGridSelectRow事件处理程序,所有这些事件处理程序都将在唯一的回调(如果存在)之前执行。onSelectRow通过这种方式,您可以在事件处理程序中实现一些常见操作,jqGridSelectRow并且可以使用额外的jqGridSelectRow事件处理程序或onSelectRow回调网格特定操作。对于完成操作,您可以使用onSelectRow回调。

对应的代码如下

$(function () {
    var $grid = $("#list"),
        editingRowId,
        myInlineEditingOptions = {
            keys: true,
            oneditfunc: function (id) { editingRowId = id; },
            afterrestorefunc: function () { editingRowId = undefined; },
            aftersavefunc: function () { editingRowId = undefined; }
        };

    $grid.bind("jqGridSelectRow", function (e, id) {
        if (id !== editingRowId) {
            if (typeof editingRowId !== "undefined") {
                // save previously editing row
                //$(this).jqGrid("saveRow", editingRowId, myInlineEditingOptions);

                // discard changes from the previously editing row
                $(this).jqGrid("restoreRow", editingRowId, myInlineEditingOptions);
            }
            // start inline editing. The user should save the row by pressing ENTER
            $(this).jqGrid("editRow", id, myInlineEditingOptions);
        }
    });

    $grid.jqGrid({
        datatype: 'local',
        ....
        editurl: 'clientArray'
    });
});

更新:我忘了提,可以在事件绑定期间使用命名空间。这在更复杂的场景中非常有用。如果有人会使用$grid.bind("jqGridSelectRow.myNamespace", ...);,那么您将只能使用$grid.unbind('.myNamespace');or取消绑定自己的事件$grid.unbind('jqGridSelectRow.myNamespace');。它不会取消绑定具有其他命名空间的其他事件。

于 2012-05-05T12:03:06.627 回答
0

我改变了一点行为。我在 ZF 视图(phtml 文件)中编写了 java 脚本“onSelectRow”,例如:

<?php $this->headScript()->captureStart() ?>
$(document).ready(function() {
    var lastSel;
    jQuery("#jqg_RentAsset").jqGrid('setGridParam', {
        onSelectRow: function(id)
        { 
            alert(id);
        }
    });
});
<?php $this->headScript()->captureEnd() ?>

及其工作。我需要的是“setGridParam” 但实际上这个东西不能使用“$grid->jqAddOnLoad($js);” 在 ZF 控制器中。当我有时间的时候,我会调查还有什么需要做的。但现在我很高兴。此外,也许有可能使用“$grid->setParams(array)”...再次感谢。:)

于 2012-05-05T13:59:16.180 回答