jqGrid(删除行) – 如何发送其他POST数据?

我遇到了jqGrid删除机制的问题,因为它只以POST数据的forms发送“oper”和“id”参数(id是表的主键)。

问题是,我需要根据id和另一个列值删除一行,比方说user_id。 如何将此user_id添加到POST数据?

我可以总结一下这个问题如下:

  1. 如何获取所选行的单元格值(user_id)?
  2. 并且,如何将该user_id添加到POST数据中,以便可以从实际删除过程发生的后面的代码中检索它。

示例代码:

jQuery("#tags").jqGrid({ url: "subgrid.process.php, editurl: "subgrid.process.php?, datatype: "json", mtype: "POST", colNames:['id','user_id','status_type_id'], colModel:[{name:'id', index:'id', width:100, editable:true}, {name:'user_id', index:'user_id', width:200, editable:true}, {name:'status_type_id', index:'status_type_id', width:200} ], pager: '#pagernav2', rowNum:10, rowList:[10,20,30,40,50,100], sortname: 'id', sortorder: "asc", caption: "Test", height: 200 }); jQuery("#tags").jqGrid('navGrid','#pagernav2', {add:true,edit:false,del:true,search:false}, {}, {mtype:"POST",closeAfterAdd:true,reloadAfterSubmit:true}, // add options {mtype:"POST",reloadAfterSubmit:true}, // del options {} // search options ); 

这不成问题。 有不同的方法来做你需要的。 最直接的方法是使用serializeDelData函数。 删除行的jqGrid代码如下所示

 var ajaxOptions = $.extend({ url: rp_ge.url ? rp_ge.url : $($t).jqGrid('getGridParam','editurl'), type: p.mtype, data: $.isFunction(p.serializeDelData) ? p.serializeDelData(postd) : postd, complete:function(data,Status){ //... }, error:function(xhr,st,err){ //... } }, $.jgrid.ajaxOptions, p.ajaxDelOptions); $.ajax(ajaxOptions); 

因此,您可以定义自己的serializeDelData函数,它可以满足您的所有需求:

 {mtype:"POST", reloadAfterSubmit:true, serializeDelData: function (postdata) { var rowdata = jQuery('#tags').getRowData(postdata.id); // append postdata with any information return {id: postdata.id, oper: postdata.oper, user_id: rowdata.user_id}; }}, // del options 

顺便说一句,如果你想自己生成发布到服务器的数据,只需返回一个字符串而不是一个对象。 然后数据将由jQuery.ajax发布而不做任何更改。

如果您希望不在发布的数据中添加其他信息,但在URL中您可以在onclickSubmit执行此onclickSubmit 。 我在服务器端使用例如RESTfull服务并删除我使用空主体的DELETE HTTP请求的项目。 所有参数都放在URL中。 相应的代码如下所示:

 {mtype:"DELETE", reloadAfterSubmit:true, serializeDelData: function (postdata) { return ""; // the body MUST be empty in DELETE HTTP requests }, onclickSubmit: function(rp_ge,postdata) { var rowdata = jQuery('#tags').getRowData(postdata.id); rp_ge.url = 'subgrid.process.php/' + encodeURIComponent(postdata.id) + '?' + jQuery.param ({user_id: rowdata.user_id}); }}, // del options 

这就是我在jqGrid上删除后向POST添加更多数据的方法:

 var grid = $("#grid").jqGrid(... //make your grid $("#grid").jqGrid('navGrid', '#pager', {add:false, edit:false, del:true}, {}, {}, {delData: { name: function() { var sel_id = grid.jqGrid('getGridParam', 'selrow'); var value = grid.jqGrid('getCell', sel_id, 'colName'); return value; } } }, {}, {}); 

这将返回一个post数组{id:rowNumber,oper:del,name:someValue}。 name是你想要在post数组中引用你的变量的方式, someValue是你感兴趣的所选行的单元格中的任何内容。

希望这可以帮助!

如果你在colModel中设置key:true ,这很容易实现,如下所示:

colModel: [ {name: 'childId', index: 'childId', align: 'center', sorttype: 'string', key:true},

这样做会导致在POST期间自动发送此字段。

key:true in colModel只是为了允许命令处理器在索引记录集上正常运行。

我有同样的问题。 我修复它的方法是将user_id作为我的jsondata中的第一列。 并使用jqgrid的jsonreader设置,您可以完成它将工作。

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data

查看jsondata的jsonreader设置。

我用:

 jsonReader: { cell: "", id: "0" } 

我的数据就像

 { totalpages: "xxx", currpage: "yyy", totalrecords: "zzz", invdata : [ {"userid","cell12", "cell13", "cell14"}, {"userid","cell22", "cell23", "cell24"}, ... ] } 

现在,如果我更新一行或删除一行,我将获得用户ID。 希望这对你有用!

我不确定如何发布其他数据,但您可以尝试将其他数据作为查询字符串参数发送,作为delete-url的一部分。

是的,您可以使用navgrid的del参数下的onclickSubmit事件向postdata添加其他数据,在您的情况下,如果您要发送包含id的user_id,则执行类似这样的操作

 $("#gridId").jqGrid({ }).hideCol(['']).navGrid('#pagerId', { edit: false, add: false, del: true, search: true, refresh: true, beforeRefresh: function () { }, afterRefresh: function () { } }, {}, {}, { afterComplete: function () { }, onclickSubmit: function (params) { var extraParameters = []; var arraySelected = $("#gridId").jqGrid('getGridParam', 'selarrrow'); for (var i = 0; i < arraySelected.length; i++) { extraParameters.push($('#gridId').getRowData(arraySelected[i]).user_id) } return { extraParams: extraParameters.join(',') }; } }, { sopt: ['cn', 'nc'], onSearch: function () { }, onReset: function () { } });