easyUI datagrid 单个单元格编辑

datagrid 可实现编辑单元格，如果有多列都需要可编辑 当点击一个单元格 则此整行都会进行编辑，如图

 

单个单元格编辑效果，如图

 

 核心代码如下

var editIndex = undefined;
//结束编辑
		function endEditing() {
			if (editIndex == undefined) {
				return true
			}
			if ($('#dataView').datagrid('validateRow', editIndex)) {
				$('#dataView').datagrid('endEdit', editIndex);
				editIndex = undefined;
				editField = undefined;
				return true;
			} else {
				return false;
			}
		}
		$.extend($.fn.datagrid.methods, {
			editCell : function(jq, param) {
				return jq.each(function() {
					var opts = $(this).datagrid('options');
					var fields = $(this).datagrid('getColumnFields', true).concat(
							$(this).datagrid('getColumnFields'));
					for ( var i = 0; i < fields.length; i++) {
						var col = $(this).datagrid('getColumnOption', fields[i]);
						col.editor1 = col.editor;
						if (fields[i] != param.field) {
							col.editor = null;
						}
					}
					$(this).datagrid('beginEdit', param.index);
					for ( var i = 0; i < fields.length; i++) {
						var col = $(this).datagrid('getColumnOption', fields[i]);
						col.editor = col.editor1;
					}
				});
			}
		});

在datagrid 的onClickCell方法中处理

onClickCell: function (index,field,value) {
					if (endEditing()) {
						$(this).datagrid('selectRow', index).datagrid('editCell', {
							index : index,
							field : field
						});
						editIndex = index;
						
						//$(ed.target).combobox('setValue',value);
					}
				}

最后在onEndEdit方法中处理修改的数据

onEndEdit: function (index, row) {
					//保存单元格数据并刷新
					console.log(row);
				}