使用 jqGrid 4.5.2 和 jQuery 1.9.1。我在网页中有一个 jqGrid，它显示从查询返回的数据行。网格中的每一行都有 2 个submit按钮，默认情况下禁用，但onSelectRow在 jqGrid 事件中启用。
我在下面的代码中添加按钮：
var ids = $("#myGrid").jqGrid("getDataIDs");
for (var i=0;i < ids.length;i++) {
var cl = ids[i];
sm = "<input id='resendMsg' style='height:25px;width:65px;' type='submit' value='Re-Send' disabled='true' />";
ca = "<input id='cancelMsg' style='height:25px;width:55px;' type='submit' value='Cancel' disabled='true' />";
$("#myGrid").jqGrid("setRowData",ids[i], {msgAct:sm+ca});
}
请注意，这些submit按钮默认情况下是禁用的。
When a row in the grid is selected, I want the two buttons for that row only to be enabled. 事件中还发生了onSelectRow我设置变量以供以后使用的地方。
var gridRow = $(this).jqGrid("getRowData",id);
var srow = $(this).jqGrid("getGridParam","selrow");
我想要的其他行为onSelectRow-
不希望能够单击该行 - 必须单击 2 个提交按钮之一才能转到网格中的另一行。一次提交采取一组操作，然后重置网格（未选择任何内容，所有行上的所有按钮都被禁用）。
另一个提交按钮（一个Cancel按钮）不执行上一步中的操作，但会重置网格（未选择任何内容，并且所有行上的所有按钮都被禁用）。
我尝试了各种方法来启用所选行上的按钮，但它要么只启用第一行、所有行，要么不启用任何行。我已经查看了srow上面的值并且可以确认它具有正确的行 ID。
您如何定位所选行中的提交按钮以启用它们（并使网格中的所有其他按钮保持禁用状态）？
谢谢！
编辑：
感谢@Oleg 和他的建议和跟进，我能够解决我的问题。@Oleg 的回答让我走上了正轨。
在colModel我放msgAct以获取每行上的按钮并与该行相关联。
{name: "msgAct",
width: col4width,
align: "center",
formatter: function() {
return "<input name='resendMsg' style='height:25px;width:65px;' type='submit' value='Re-Send' disabled='disabled' />" +
"<input name='cancelMsg' style='height:25px;width:55px;' type='submit' value='Cancel' disabled='disabled' />"
}}
在 中OnSelectRow，我还使用他的建议关闭jqGrid 中的所有按钮，然后打开我选择的行中的按钮。
// disable all resendMsg & cancelMsg buttons in the grid
$(this).find("input[name=resendMsg]").attr("disabled","disabled");
$(this).find("input[name=cancelMsg]").attr("disabled", "disabled");
// now enable the buttons for the current row only
$(tr).find("input[name=resendMsg]").removeAttr("disabled");
$(tr).find("input[name=cancelMsg]").removeAttr("disabled");
我还有其他代码可以禁用页面上的任何其他下拉菜单，因此只能发生以下三种情况之一：
- 用户可以点击重新发送按钮
- 用户可以点击取消按钮
- 用户可以单击 jqGrid 上的另一行
由于上面的#3 会触发另一个OnSelectRow事件，我希望用户必须对选定的行 做一些事情。
使用@Oleg 的建议关闭所有并仅打开所选行的按钮，我还将每个按钮的单击事件代码放在onSelectRow事件中。
$(tr).find("input[name=cancelMsg]").click(function() {
// disable all resendMsg & cancelMsg buttons in the grid
$(this).find("input[name=resendMsg]").attr("disabled","disabled");
$(this).find("input[name=cancelMsg]").attr("disabled", "disabled");
....do other stuff .....
ReloadGrid();
});
$(tr).find("input[name=resendMsg]").click(function() {
ReSend(gridRow.Col1, gridRow.Col2);
// disable all resendMsg & cancelMsg buttons in the grid
$(this).find("input[name=resendMsg]").attr("disabled","disabled");
$(this).find("input[name=cancelMsg]").attr("disabled", "disabled");
.... do other stuff ....
});
},
网格现在做我想做的事。例如 -
- 当网格加载时，网格中的所有行都有一个 msgAct 列，并且该列中有一个 Re-Send 和一个 Cancel 按钮，这两个按钮都存在，但显示为灰色。
- 如果选择第 3 行，则第 3 行的 msgAct 重新发送和取消按钮现在被激活并且可以单击。网格中的所有其他行中的每个行中的按钮仍然是灰色的。
- 如果用户单击“重新发送”或“取消”，则会针对网格中的该行执行相应的操作。Re-send 将另一行添加到网格中，而 Cancel 重置选择并且网格显示为加载时的样子。
- 用户可用的唯一选项是单击重新发送、取消或选择不同的行。选择不同的行然后启用该行上的按钮（禁用先前选择的按钮），单击其中任何一个都会启动该行的适当操作。
现在的问题可能是 - 有没有更好的方法来做到这一点？
感谢@Oleg 提供的宝贵帮助！