Question

我目前正在使用asp.net开发一个用户将与jqgrid版本4.4.4交互的页面。由于版本，我不能使用formatter：＆＃39; action＆＃39;。我有一个自定义格式化程序，它显示了一个编辑/保存链接。

我目前有这个

return "<a href='javascript:void(0)' class='anchor usergroup_name link' onclick=\"editRow('" + rowobject.id + "')\">" + 'edit' + "</a>" +" | "
          +"<a href='javascript:void(0)' class='anchor usergroup_name link' onClick=\"saveRow('" + rowobject.id + "')\">" + 'save' + "</a>";

此代码确实添加了一个编辑/保存按钮，可以编辑/保存行。但是，我希望一次只显示其中一个来改进功能。例如，如果用户单击编辑，则会出现保存/取消，编辑将消失。

为了做到这一点，我尝试给html链接一个id，但是在执行$（＆＃39; id＆＃39;）之后只有第一行会消失.hide（）。

是否有方法可以为每个链接指定唯一ID，还是有更好的方法来执行此操作？

感谢您的帮助!!

Answer 1

jqGrid 4.4.4已经五岁半了！很长一段时间以来它都不受支持。我想你通过NuGet包jQuery.jqGrid获得了jqGrid 4.4.4。在这种情况下，我建议您卸载软件包并安装free-jqGrid 4.15.4。之后，您可以使用formatter: "actions"或template: "actions"。

如果您仍想了解如何使用自定义格式化程序实现您的要求，那么您有一些替代方案。第一种方法是使用旧代码，但修改editRow（或saveRow）

的调用

return "<a href='javascript:void(0)' class='anchor usergroup_name link' onclick=\"editRow('" + rowobject.id + "')\">" + 'edit' + "</a>" +" | "
      +"<a href='javascript:void(0)' class='anchor usergroup_name link' onClick=\"saveRow('" + rowobject.id + "')\">" + 'save' + "</a>";

到

return "<a href='javascript:void(0)' class='anchor usergroup_name link' onclick=\"editRow.call(this,'" + rowobject.id + "')\">edit</a>"+
      "<a style='display:none' href='javascript:void(0)' class='anchor usergroup_name link' onClick=\"saveRow.call(this,'" + rowobject.id + "')\">save</a>";

将调用

onclick方法，并将this初始化为<a>的DOM元素，用户点击该元素。

在您的全局函数editRow和saveRow中，您可以使用$(this).next().show();或$(this).prev().show();来显示第二个链接并使用$(this).hide()来隐藏当前链接。最简单的editRow和saveRow代码如下：

function editRow (rowid) {
    $(this).hide()
        .next().show()
        .closest(".ui-jqgrid-btable").jqGrid("editRow", rowid);
}
function saveRow (rowid) {
    $(this).hide()
        .prev().show()
        .closest(".ui-jqgrid-btable").jqGrid("saveRow", rowid);
}

另一种方法是根本不使用任何内联onclick属性。点击事件支持event bubbling。这意味着在网格的任何DOM元素内部单击会将事件传播到父级树。因此，足以在网格的主click元素上定义<table>事件。 jqGrid已经这样做了。可以使用beforeSelectRow回调函数，该函数将在jqGrid注册的click事件处理程序内部调用。 Event对象的target属性（beforeSelectRow的第二个参数）将是单击的元素。因此，您只需验证e.target是否具有您用于链接的类usergroup_name，如果是，请执行主要工作：启动editRow（或{ {1}}），隐藏/显示链接等。看看the old answer，它展示了这种方法。

JQGrid自定义格式化程序 - 无格式化编辑/保存/取消：＆＃39;动作＆＃39;

1 个答案: