グリッド外の「送信」ボタンをクリックすると、すべてのサブグリッド データを MVC コントローラーに投稿する必要があります。
$("#simpleGrid").jqGrid({
url: '@Url.Action("GetMainGridData")',
datatype: 'json',
mtype: 'GET',
colNames: ['', 'Codeset Category', 'Operating Amt', 'Direct Amt', 'Adjust Amt'],
colModel: [
{ name: 'CodesetCategoryId', hidden: true },
{ name: 'CodesetCategoryDesc', width: 200},
{ name: 'OperatingAmt', width: 200, align: 'right' },
{ name: 'DirectAmt', width: 200, align: 'right' },
{ name: 'AdjustAmt', width: 200, align: 'right' }
],
rowNum: 30,
height: "100%",
multiselect: false,
viewrecords: true,
caption: 'Expense Details',
altRows: true,
pager: '#pager',
subGrid: true,
subGridOptions: {
"plusicon": "ui-icon-triangle-1-e",
"minusicon": "ui-icon-triangle-1-s",
"openicon": "ui-icon-arrowreturn-1-e"
},
subGridRowExpanded: function (subgrid_id, row_id) {
var subgrid_table_id, pager_id;
subgrid_table_id = subgrid_id + '_t';
pager_id = "p_" + subgrid_table_id;
$('#' + subgrid_id).html('<table id="' + subgrid_table_id + '" class="scroll"></table><div id="' + pager_id + '" class="scroll"></div>');
$('#' + subgrid_table_id).jqGrid({
url: encodeURI('@Url.Action("GetSubGridData")' + '?rowid=' + row_id),
datatype: 'json',
mtype: 'GET',
colNames: ['','','','', 'Program Name', 'Operating Amt', 'Direct Amt', 'Adjust Amt'],
colModel: [
{ name: 'id', hidden: true },
{ name: 'submissionid', hidden: true },
{ name: 'programid', hidden: true },
{ name: 'codesetid', hidden: true },
{ name: 'ProgramName', width: 200 },
{ name: 'OperatingAmt', width: 200, align: 'right', editable: true },
{ name: 'DirectAmt', width: 200, align: 'right', editable: true },
{ name: 'AdjustAmt', width: 200, align: 'right', editable: true }
],
rowNum: 20,
sortname: 'id',
pager:pager_id,
viewrecords: true,
onSelectRow: function(id){
if(id && id!==lastsel){
jQuery(subgrid_table_id).restoreRow(lastsel);
jQuery(subgrid_table_id).editRow(id,true);
lastsel=id;
}
},
cellEdit: true,
cellsubmit: 'clientarray',
jsonReader: {
id: "id",
repeatitems: true},
height: '100%'
});
$("#" + subgrid_table_id).jqGrid('navGrid', "#" + pager_id, { edit: false, add: false, del: false, search: false, refresh: false });
}
});
次のコードを使用して、親グリッド データを取得できます。
$('#btnSubmit').click(function () {
var griddata = $("#simpleGrid").jqGrid('getRowData');
var dataToSend = JSON.stringify(griddata);
alert(dataToSend);
$.ajax({
type: 'POST',
url: '@Url.Action("SaveSubGridDataNew")',
data: dataToSend,
traditional: true,
dataType: "json",
contentType: "application/json; charset=utf-8"
});
})
サブグリッドデータを取得するには? サブグリッドはインライン編集可能です。
前もって感謝します