希望你早上好。
我想在我的 Asp.Net 应用程序中使用 jqGrid。到目前为止，我一直在生成一个 html 表并将其转换为网格，但我想尝试一种更好的方法：通过 AJAX 调用加载数据，因为它应该与网格一起使用。我发现了如何获取数据，但除了数据列之外，我还想要“编辑”和“删除”列。我如何实现它？
我宁愿不为我的控制器中的按钮制作 html。理想的解决方案是只发送数据，并让 jqGrid 根据一些客户端模板和 id 值添加所需的列。我无法手动执行此操作，因为我无法将列添加到现有网格。那么，我该怎么办？
更新。我不需要仅仅实现编辑/删除功能。我需要的是基于一些模板和“id”值添加一个带有 HTML 的列，比如<a href="MoreDetails/{id}">[More details]</a>
【问题讨论】：
标签： asp.net-mvc jqgrid command jqgrid-asp.net
如果你使用jqGrid，从服务器发回纯数据是正确的方法。
要实现您想要的行编辑，请查看jqGrid Demo 并在左侧选择“行编辑”，然后选择“自定义编辑”。我个人更喜欢使用如此命名的“inline editing”（在“行编辑”下的同一个演示“输入类型”中选择）。您通过双击而不是选择行来实现编辑模式的切换（参见jqGrid - edit only certain rows for an editable column 作为示例）。要删除行，您还可以使用“form editing”中的“删除”按钮。要使用它，您应该在 navGrid 方法中添加Navigator，并使用相应的参数选择工具栏中您需要的按钮。要在演示中查看此内容，请选择“Live Data Manipulation”，然后选择“Navigator”。
更新：在jqGrid Demo 中，查看“行编辑”，然后查看“自定义编辑”，您可以看到如何在gridComplete 或loadComplete 中使用setRowData 句柄来处理设置 ANY HTML 代码片段。为什么不喜欢这种方法？您还可以使用predefined showlink formatter 显示链接或使用custom formatter 和custom unformatter 在jqGrid 单元格中显示任何HTML 包含。
【讨论】：
editRow、saveRow 和restoreRow。
您现在可能已经想通了，但是对于这里有价值的是我使用自定义格式化程序的答案。 Action 列是使用自定义格式化程序呈现的，该格式化程序显示一个调用简单 javascript 函数的按钮。
$(document).ready(function () {
$("#all-errors-list").jqGrid({
url: '/Error/AllErrors/',
datatype: 'json',
mtype: 'GET',
colNames: ['Id', 'Error','Actions'],
colModel: [
{ name: 'Id', index: 'Id', width: 100, align: 'left', editable: true},
{ name: 'ErrorDetails', index: 'ErrorDetails', width: 350, align: 'left' },
{ name: 'ActionId', width:400, formatter: actionFormatter}
],
pager: '#all-errors-pager',
rowNum: 10,
rowList: [10, 20, 50],
sortname: 'Id',
sortorder: 'asc',
viewrecords: true,
imgpath: '<%=Html.ImagePath()%>',
caption: 'Open Errors',
height: "100%",
width: "100%",
gridComplete: function () { $("button").button(); }
})
function actionFormatter(cellvalue, options, rowObject) {
return "<button onclick=\"alert('" + cellvalue + "')\">Details</button>" ;
}
希望对你有帮助。
【讨论】：