grid 实现点击单元格，进行编辑，编辑后保存到后台（java ）

效果，点击参数值单元格，实现编辑文本框编辑保存。

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