效果,点击参数值单元格,实现编辑文本框编辑保存。
1,js代码
// 表格列名
var colModel = [
{"hidden":false,"align":"left","sortable":true,"width":"4%","name":"id","resizable":true,"label":"ID"},
{"hidden":false,"align":"left","sortable":false,"width":"20%","name":"paramname","resizable":true,"label":"参数名"},
{"hidden":false,"align":"left","sortable":false,"width":"20%","name":"paramvalue","resizable":true,"editable": true,"label":"参数值" ,cellattr: function(rowId, val, rawObject, cm, rdata) {
return "style=' color:blue'";
}},
{"hidden":false,"align":"left","sortable":false,"width":"20%","name":"remark","resizable":true,"label":"说明"}
];
$("#"+this.jqGridId).jqGrid({
url: this.url,
mtype: "POST",
postData: this.postData,
datatype: 'json',
shrinkToFit:this.shrinkToFit,//为true时列宽百分比自适应,为false时定宽出水平滚动条
colModel: this.colModel,
width: this.width,
height: this.height,
pager: this.jqGridPagerId,
viewrecords: this.viewrecords,
sortname: this.sortname,
sortorder: this.sortorder,
multiselect: this.multiselect,
gridview: false,
rownumbers:this.rownumbers,
rownumWidth:40,
rowList : [20,30,50],
jsonReader: {
root: function (obj) {
// console.log("root:"+obj.message.record);
return obj.resultData.content;
},
page: function (obj) {
// console.log("page:"+obj.message.page);
return obj.resultData.number+1;
},
total: function (obj) {
// console.log("total:"+obj.message.pageTotal);
return obj.resultData.totalPages;
},
records: function (obj) {
// console.log("records:"+obj.message.total);
return obj.resultData.totalElements;
},
repeatitems: false
},
cellsubmit:"clientArray",
cellEdit: true,
beforeEditCell:function(rowid,cellname,value,iRow,iCol){
lastrow = iRow; //给全局变量赋值
lastcell = iCol;
},
afterEditCell:function(rowid,cellname,value,iRow,iCol){
console.info(value);
},
beforeSaveCell:function(rowid,cellname,value,iRow,iCol){
console.info(value);
},
afterSaveCell:function(rowid,cellname,value,iRow,iCol){
console.info(value);
},
gridComplete : function(){
if(callback!=null){
callback();
}
}
});
});
};
var lastrow;
var lastcell;
是定义的全局变量
function save() {
$("#jqGridId-1").jqGrid("saveCell",lastrow,lastcell);
var rowIds = $("#jqGridId-1").jqGrid('getDataIDs');
var paraArr = [];
for(var i=0,j = rowIds.length - i;i < j; i++){
var rowData = $("#jqGridId-1").jqGrid('getRowData',rowIds[i]);
if(rowData.paramvalue.length>150){
// console.info("第"+(i+1)+"行录入内容太长");
return false;
}
var param = {
paramname: rowData.paramname,
paramvalue: rowData.paramvalue
};
paraArr.push(JSON.stringify(param));
}
var data = {} ;
data["sysparamarr"] = paraArr;
$.ajax({
type: "post",
url: "updateSysparam.req",
data: JSON.stringify(data),
contentType : "application/json",
dataType: "json",
success: function(data) {
console.info(data.message);
if(data.success){
searchList();
}
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.info("调用失败....");
console.log(XMLHttpRequest.status);
console.log(XMLHttpRequest.readyState);
console.log(textStatus);
}
});
}
java 控制层 接收处理:
@RequestMapping(value = "/updateSysparam.req", method = RequestMethod.POST)
@ResponseBody
public Map updateSysparam(@RequestBody JSONObject obj) {
Map map = new HashMap<>();
if (obj.containsKey("sysparamArr")) {
JSONArray jsonArr= JSONArray.parseArray(obj.get("sysparamArr").toString());
for (int i = 0; i < jsonArr.size(); i++) {
JSONObject item = jsonArr.getJSONObject(i);
System.out.println(item.toJSONString());
// 数据库保存修改。
}
}
map.put("message","参数值修改成功");
map.put("success",true);
return map;
}