jqgrid 行内修改单元格内容
由于字段较多,但可供用户修改的 字段仅有一个,所有不想通过弹出对话框的方式让用户进行修改。还好jqgrid支持行内数据修改,首先要将cellEdit设为true以支持对单元格的 修改操作。这里讲cellsubmit设为clientArray,当修改完成后并不直接发送到服务器进行保存,而是先保存在table中,当用户点击保 存按钮是才向数据库发送请求更新数据。
cellEdit: true, cellsubmit: "clientArray", //当单元格发生变化后不直接发送请求、"remote"默认直接发送请求
要修改的字段是select类型:
{name:'YCFWZT',index:'YCFWZT', width:80,align:"center",sortable:false,formatter:'select', formatoptions:{value:{1:'正常', 2:'维修', 3:'常用'}}, editable:true,edittype:'select',editoptions:{value:{1:'正常', 2:'维修', 3:'常用'}}},
这里有一个问题,就是当用户修改该字段后直接进行保存操作,由于修改后的数据未保存到table中,而且原数据丢失,会导致字段为空。所以要先设法 使被编辑的单元格失去焦点,数据即可保存到本地table中。这里当用户点击保存按钮后首先让每行的第一个字段获取焦点,这样数据就会得到保存,然后进行 保存操作:
$("#list2").editCell(rowid, 1, true);
onSelectRow: function(id){ if(id && id!==lastsel2){ jQuery('#detailStatisticsTab').jqGrid('saveRow',lastsel2); //$('#detailStatisticsTab').restoreRow(lastsel2); jQuery('#detailStatisticsTab').jqGrid('editRow',id,true); //jQuery('#gridid').editRow(id, true); lastsel2=id; } }
jqGrid重置
$('#detailStatisticsTab').trigger("reloadGrid"); // 重新载入
jqGrid遍历所有行
var rowIds = $("#detailStatisticsTab").jqGrid('getDataIDs');
var paraArr = [];
for(var i=0,j = rowIds.length - i;i < j; i++) { var rowData = $("#detailStatisticsTab").jqGrid('getRowData',rowIds[i]); var MC_STATE_NAME = rowData.MC_STATE_NAME; var MC_STATE = rowData.MC_STATE;var param = { MC_ID: rowData.MC_ID, MC_STATE: MC_STATE }; //paraArr.push(param); paraArr.push(JSON.stringify(param)); } }