如何在jqgrid中添加新的按钮/图像列

我在ASP.net MVC Web应用程序中使用JQgrid。

我可以使用formatters添加一个名为edit的新按钮列

但是,问题是我无法获得单击按钮的行中的列值。

例如,如果我在第4行单击按钮编辑(新添加),我将需要获取该特定行的第一列的值。

我需要这个,因为我想重定向到具有该值的另一​​个页面并在那里进行编辑。

我无法获取该值并向其添加javascript。

请使用任何代码示例帮助解决此问题。

您不需要将click事件处理程序绑定到列中的每个按钮。 每个绑定都占用了Web浏览器的内存和其他资源。 从内部到外部DOM元素冒泡的大多数事件(参见此处 ),鼠标单击,键盘键控,触摸touchstart和网格内部按钮上的其他事件将冒泡到网格的

元素。 jqGrid默认情况下在网格上click事件处理程序。 它调用onCellSelectonCellSelect回调并从事件处理程序触发jqGridBeforeSelectRowjqGridCellSelect事件。 因此,不是在每个按钮上绑定自己的click事件处理程序,而是使用上面列出的回调或事件中的一个。 将首先使用jqGridBeforeSelectRow (或jqGridBeforeSelectRow )。 如果单击按钮时没有选择相应的行,则回调是实用的。 例如,答案显示了如何validation是否需要调用所需的列。 另一个答案提供了一个非常接近您需要的例子。 还有一个答案为您提供了另一个代码片段 要查看有关该主题的更多旧答案,您可以使用以下查询 。

更新 :演示http://jsfiddle.net/ShKDX/82/是对Manuel van Rijn发布的演示的修改。 它表明了我的意思。

这是一个简单的示例,您可以如何动态地将按钮添加到jqgrid

http://jsfiddle.net/ShKDX/1/

不确定你的第一行是否是小提琴中指定的id,但你可以修改它以使用来自afterInsertRow函数的正确数据

 var data = [ {id: 1, text: 'row1'}, {id: 2, text: 'row2'}, {id: 3, text: 'row3'}, {id: 4, text: 'row4'}, {id: 5, text: 'row5'}, ]; $("#grid").jqGrid({ datatype: "local", height: 250, colNames: ['Id', 'Text', 'edit'], colModel: [ { name: 'id', index: 'id', sorttype: "int" }, { name: 'text', index: 'text' }, { name: 'edit', index: 'edit', align: 'center', sortable: false, width: '40px' } ], caption: "Custom buttons", data: data, afterInsertRow: function(id, currentData, jsondata) { var button = "edit"; $(this).setCell(id, "edit", button); }, loadComplete: function(data) { $(".gridbutton").on('click', function(e) { e.preventDefault(); alert('Edit id: ' + $(this).data("id")); }); } });