これは、jqgridでローカル削除が行われた後にイベントを発生させることです。なぜなら、私はウェブサイトのグローバルセーブを扱っているからです。そのため、サーバーに直接ポストしているわけではありません。 JSON形式のデータをページ上の隠し要素内に格納するので、ユーザーが最後に要素値を保存すると、他のすべてのデータと共にサーバーに送信されます。ローカル削除後にイベントを発生するjqgrid
問題は、jqgridから行を削除したときに、隠し要素を変更することができないことです。その場合、ユーザーが削除後に保存した場合は削除されなかったようです。
$("#translationMappingGrid").jqGrid({
data: mydata,
datatype: "local",
mtype: 'GET',
colNames:['From','To', 'Type'],
colModel :[
{name:'from',index:'from', width:180, align:"left",sorttype:"float", editable: true, editrules:{custom:true, custom_func:validateIPGridInput}},
{name:'to',index:'to', width:180, align:"left",sorttype:"float", editable: true, editrules:{custom:true, custom_func:validateIPGridInput}},
{name:'type',index:'type', width:200,align:"left",sorttype:"float", editable: true,
edittype:"select", formatter:'select', editoptions:{
value:"0:Never Translate;1:Always Translate;2:Only If Source;3:Only If Destination"}
},
],
pager: '#pager',
rowNum:10,
rowList:[10,20,30],
sortname: 'invid',
sortorder: 'desc',
viewrecords: true,
gridview: true,
caption: 'Mapping',
editurl: 'probe.sysinfo.ajax',
url:'clientArray',
onSelectRow: function(id){
jQuery('#translationMappingGrid').jqGrid('restoreRow',lastsel2);
//below are the parameters for edit row, the function is called after a successful edit has been done
//jQuery("#grid_id").jqGrid('editRow',rowid, keys, oneditfunc, succesfunc, url, extraparam, aftersavefunc,errorfunc, afterrestorefunc);
jQuery('#translationMappingGrid').jqGrid('editRow',id,true,"","","","",function() {
setTranslationMappingJSON(getGridDataJSONString(this));
window.parent.document.getElementById('notificationDiv').style.display= "";
});
lastsel2=id;
},
afterInsertRow: function(rowid, rowdata, rowelem){
//alert("after insert row");
setTranslationMappingJSON(getGridDataJSONString(this));
window.parent.document.getElementById('notificationDiv').style.display= "";
}
});
//adds buttons to jqgrid nav bar
jQuery("#translationMappingGrid").navGrid('#pager',{
edit:false,add:true,del:true,search:false,refresh:true
}, {
closeAfterAdd:true,
closeAfterEdit: true
},
{
closeAfterAdd:true,
closeAfterEdit: true,
afterSubmit: function(response, postdata) {
alert("after complete row");
setTranslationMappingJSON(getGridDataJSONString(this));
window.parent.document.getElementById('notificationDiv').style.display= "";
return [true,""];
}
});
私は成功しafterrestorefunc経由で追加および編集(インライン)の両方で変更で隠し要素を更新していますが、これは、削除のために働いていません上記のコードで示されているように。
上記のコードでafterSubmitを使用しようとしましたが、これは動作しません。私は数日間この作業に取り組んできましたが、削除ボタンのための独自のカスタムコードを書く必要があるかもしれないという結論に至りましたが、これは当てはまりません。
解決策を見つけたとき私は興奮しましたが、残念ながら私たちの場合は少し異なります。私はnavgridを使用して終了しましたが、行が削除されると(たとえば、私が使用しているように 'delRowData'によって)何らかのイベントを発生させたいと思います。しかし、あなた自身、非常に良い説明でそれを見つけたことは素晴らしい! –