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)); } }

 

posted @ 2013-11-12 11:38  小水阿哥  阅读(12107)  评论(0编辑  收藏  举报