jqGrid中的自定义删除按钮

我想在jqGrid中实现自己的删除function。 我目前正在使用内置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,我想避免使用它。

它也没有利用JqG​​rid ASP.NET组件提供的服务。 该组件实际上负责所有CRUD操作,只要它连接到正确配置的数据源(ObjectDataSource,SqlDataSource等)。

对我来说这个缺失的部分是组件CRUD操作背后的机制。 通过与Fiddler讨论,我能够看到它将相关数据POST到同一页面,并使用查询字符串中的JqGrid对象的ClientID:

  MyPage.aspx?jqGridID = ctl00_ctl00_Content_Content_MyJqGrid 

对于删除,POST的内容如@Erik所述:

  OPER =德尔&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(); });