我想在 jqGrid 中实现我自己的删除功能。我目前正在使用内置 UI(选择行,按页脚中的垃圾桶按钮,确认),但我希望在每一行中都有一个删除按钮并实现我自己的 UI 以进行确认。
我在API中看不到任何允许我对服务器执行删除操作的内容 - 只是delRowData
,它会在客户端上删除它。这可以做到吗?
(我正在使用ASP.NET 组件,FWIW)。
我想在 jqGrid 中实现我自己的删除功能。我目前正在使用内置 UI(选择行,按页脚中的垃圾桶按钮,确认),但我希望在每一行中都有一个删除按钮并实现我自己的 UI 以进行确认。
我在API中看不到任何允许我对服务器执行删除操作的内容 - 只是delRowData
,它会在客户端上删除它。这可以做到吗?
(我正在使用ASP.NET 组件,FWIW)。
没有处理服务器端删除的基本 jqGrid 组件的任何部分 - 即使您使用内置删除,它也不会为您在服务器端删除它,您必须自己处理。但这里是如何设置它,以便在有人单击您的自定义删除按钮时调用您的脚本:
// your custom button is #bDelete
$("#bDelete").click(function(){
// Get the currently selected row
toDelete = $("#mygrid").jqGrid('getGridParam','selrow');
// You'll get a pop-up confirmation dialog, and if you say yes,
// it will call "delete.php" on your server.
$("#mygrid").jqGrid(
'delGridRow',
toDelete,
{ url: 'delete.php',
reloadAfterSubmit:false}
);
});
以下信息通过 POST 传递到您的删除 URL
Array
(
[oper] => del
[id] => 88
)
在这种情况下,id 显然是您传递给函数的 id,即toDelete
.
实际上,我只是为自己的项目这样做,以回应您的问题-尽管在看到问题之前我对如何执行此操作有一个模糊的想法。所以......谢谢你让我明白了!
@Erik 让我走上了正确的道路。他的解决方案有效,但保留了我想避免的现有伪模式弹出确认 UI。
它也没有利用JqGrid ASP.NET 组件提供的服务。只要连接到正确配置的数据源(ObjectDataSource、SqlDataSource 等),该组件实际上就负责所有 CRUD 操作。
对我来说,这个缺失的部分是组件 CRUD 操作背后的机制。通过使用 Fiddler,我可以看到它将相关数据发布到同一页面,查询字符串中包含 JqGrid 对象的 ClientID:
MyPage.aspx?jqGridID=ctl00_ctl00_Content_Content_MyJqGrid
对于删除,POST 的内容如@Erik 所述:
操作=del&id=18
所以我已经能够自己复制操作,这样我就可以完全控制整个过程:
$(".DeleteButton", grid).click(function(e) {
var rowID = getRowID(this);
$(grid).setSelection(rowID, false);
if (confirm('Are you sure you want to delete this row?')) {
var url = window.location + '?jqGridID=' + grid[0].id;
var data = { oper: 'del', id: rowID };
$.post(url, data, function(data, textStatus, XMLHttpRequest) {
$(grid).trigger("reloadGrid");
});
} else {
$(grid).resetSelection();
} // if
}); // click
getRowID = function(el) {
return $(el).parents("tr").attr("id");
};
另一种解决方案是以编程方式单击删除图标(如果存在)。删除图标(实际上是一个 div)的 id 是“del_[GridId]”。这可能不是一个完全可靠的解决方案,因为它们可能会更改该 id 命名。但是您会得到完全相同的行为(以及更好的确认模式)。
例子:
$('#MyButton').click(function() { $('#del_' + gridId).click(); });