自定义行内的 jqGrid 编辑按钮以打开新视图

customize jqGrid edit button inside row to open new view

所以 jqGrid 每一行内的编辑按钮的默认行为是在同一页面中打开表单,对吗?

我需要它来打开另一个视图,另一个 URL。

我已经使用 .navButtonAdd 方法通过位于 grid-pager 中的编辑按钮成功地做到了这一点。但是我不知道如何对行按钮执行相同的操作。

有人能帮帮我吗?

jqGrid 目前不提供任何简单的方法来将编辑调用替换为另一种方法或包含自定义按钮。您可以选择使用 "subclassing" $.fn.fmatter.rowactions 函数,就像我在 the answer 中描述的那样。 $.fn.fmatter.rowactions 函数将在单击任何来自操作按钮时被调用。所以你可以测试act参数是否为"edit"。如果没有 "edit" 按钮,您可以将调用转发给原始 $.fn.fmatter.rowactions 函数。如果是 "edit" 按钮,您可以改为执行任何自定义操作。

UPDATED:确切的实现在一定程度上取决于您使用的 jqGrid 版本,因为函数 $.fn.fmatter.rowactions 的参数和 this 的值对于不同版本的 jqGrid 是不同的。我为您创建 the demo which uses free jqGrid 4.8 (see readme and wiki)。我使用以下代码进行子类化

var orgRowActions = $.fn.fmatter.rowactions;
$.fn.fmatter.rowactions = function (e, act) {
    var $grid = $(this).closest("table.ui-jqgrid-btable"),
        rowid = $(this).closest("tr.jqgrow").attr("id");

    if (act === "edit") {
        $grid.jqGrid("viewGridRow", rowid);
        return false;
    }
    return orgRowActions.call(this, e, act);
}

因此 "Edit" 按钮启动 "View" 而不是编辑表单。

我计划在下一版本的免费 jqGrid 中包含更多的定制可能性。因此,无需使用子类化技巧就可以创建自定义内联图标。