我在 ASP.net MVC Web 应用程序中使用 JQgrid。
我能够通过使用添加名为编辑的新按钮列formatters
但是,问题是我无法获取单击按钮的行中的列的值。
例如,如果我在第 4 行单击按钮编辑(新增),我将需要获取该特定行的第一列的值。
我需要这个因为我想重定向到具有该值的另一个页面并在那里进行编辑。
我无法获取该值并向其添加 javascript。
请使用任何代码示例对此提供帮助..
我在 ASP.net MVC Web 应用程序中使用 JQgrid。
我能够通过使用添加名为编辑的新按钮列formatters
但是,问题是我无法获取单击按钮的行中的列的值。
例如,如果我在第 4 行单击按钮编辑(新增),我将需要获取该特定行的第一列的值。
我需要这个因为我想重定向到具有该值的另一个页面并在那里进行编辑。
我无法获取该值并向其添加 javascript。
请使用任何代码示例对此提供帮助..
这是一个简单的示例,您可以如何将按钮动态添加到 jqgrid
不确定您的第一行是否是小提琴中指定的 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 = "<a class='gridbutton' data-id='"+id+"' href='#'>edit</a>";
$(this).setCell(id, "edit", button);
},
loadComplete: function(data) {
$(".gridbutton").on('click', function(e) {
e.preventDefault();
alert('Edit id: ' + $(this).data("id"));
});
}
});
您不需要将click
事件处理程序绑定到列中的每个按钮。每个绑定都会占用 Web 浏览器的内存和其他资源。大多数从内部到外部 DOM 元素冒泡的事件(请参阅此处)、鼠标单击、键盘按键、触摸触摸启动和网格内部按钮上的其他事件将冒泡到网格的<table>
元素。jqGrid 默认click
在网格上注册事件处理程序。它从事件处理程序调用beforeSelectRow
和onCellSelect
回调以及触发器jqGridBeforeSelectRow
和事件。jqGridCellSelect
因此,与其在每个按钮上绑定您自己的click
事件处理程序,使用上面列出的回调或事件中的一个就足够了。beforeSelectRow
(或者jqGridBeforeSelectRow
) 将首先使用。如果您单击按钮没有选择相应的行,则回调是实用的。例如,答案显示了如何验证您需要的列是否被调用。另一个答案提供了一个非常接近您需要的示例。再一个答案给你另一个代码片段。要查看有关该主题的更多旧答案,您可以使用以下查询。
更新:演示http://jsfiddle.net/ShKDX/82/是对 Manuel van Rijn 发布的演示的修改。它证明了我的意思。