编辑单元格

<table id="dg" class="easyui-datagrid" style="width: 1000px; height: 280px;"  
    data-options=" iconCls: 'icon-edit',  
                    toolbar: '#tb',  
                    rownumbers:true,  
                    singleSelect: false,  
                    url: 'QuantifyRecord.ashx/ProcessRequest',  
                    method:'get',  
                    pagination:true,  
                    onClickCell: onClickCell">  
    <thead>  
        <%--field中带有editor的是可以编辑的，其余列是不能编辑的--%>  
        <tr>  
            <th data-options="field:'ck',checkbox:true"></th>  
            <th data-options="field:'DepartmentName',width:200">单位名称</th>  
            <th data-options="field:'Name',width:350">指标名称</th>  
            <%--数字，小数点4位，--%>  
            <th data-options="field:'Data',width:150,editor:{type:'numberbox',options:{ precision:4}}">成绩</th>  
            <th data-options="field:'remarks',width:150,editor:'text'">备注</th>  
        </tr>  
    </thead>  
    </table>  
    
    //可编辑的datagrid  --TODO:范晓权 给EasyUI扩展方法；添加editCell方法；  
       //方法扩展editCell；  
       $.extend($.fn.datagrid.methods, {  
           //两个参数  
           // jq:   
           // param:对象，包含index 和 鼠标点击的列属性；  
           //jq = [table#dg.easyui-datagrid, context: document, selector: "#dg"], param = Object {index: 1, field: "Data"}  选择的是Data列，  
           editCell: function (jq, param) {  
               //each() 遍历；  
               return jq.each(function () {  
                   //options:返回属性对象。 这个时候的this表明：jq;  
                   var opts = $(this).datagrid('options');                                                                                                         
                   //getColumnFields:返回列的字段，若是 frozen 设置为 true，则冻结列的字段被返回。  
                   //concat:用于链接两个或多个数组。该方法不会改变现有的数组，而仅仅会返回被链接数组的一个副本  
                   //与HTML的editor属性有关；可以编辑的列和不能编辑的列；  
                   //fields的值，和上面HTML对应；  
                       //Array[5]  
                       //0: "ck"  
                       //1: "DepartmentName"  
                       //2: "Name"  
                       //3: "Data"  
                       //4: "remarks"  
                   var fields = $(this).datagrid('getColumnFields', true).concat($(this).datagrid('getColumnFields'));  
                   //下面for循环，设定列可以编辑。当不能编辑时，editor的值为undefined，可以编辑值为text;  
                   for (var i = 0; i < fields.length; i++) {  
                       var col = $(this).datagrid('getColumnOption', fields[i]);  
                       col.editor1 = col.editor;  
                       //循环到的列，不等于鼠标点击的那一列时，设定列的editor的值为null；  
                       if (fields[i] != param.field) {  
                           col.editor = null;  
                       }  
                   }  
                   //开始对一行进行编辑。param.index 为行号；对选中的一行进行编辑；  
                   $(this).datagrid('beginEdit', param.index);  
                   //for循环，设置col  
                   for (var i = 0; i < fields.length; i++) {  
                       //getColumnOption:返回指定列的选项。  
                       var col = $(this).datagrid('getColumnOption', fields[i]);  
                       //给列的editor属性赋值；text 或者其余；  
                       col.editor = col.editor1;  
                   }  
               });  
           }  
       });  
       //定义一个 行号遍历 赋值为undefined；  
       var editIndex = undefined;  
       //该函数的返回值为Boolean；  
       function endEditing() {  
           if (editIndex == undefined) { return true }  
           //验证指定的行，有效时返回 true。 -范晓权  
           if ($('#dg').datagrid('validateRow', editIndex)) {  
               //结束对一行进行编辑。  
               $('#dg').datagrid('endEdit', editIndex);  
               editIndex = undefined;  
               return true;  
           } else {  
               return false;  
           }  
       }  
  
       //双击单元格，index是行值，field是列的字段名；  
       function onClickCell(index, field) {  
           
           //endEditing 的返回值是boolean 值；当返回值为true的时候；  
           if (endEditing()) {  
               //选中一行，行索引从 0 开始。  
               $('#dg').datagrid('selectRow', index)  
                   //行值和字段内容  TODO：范晓权  
                       .datagrid('editCell', { index: index, field: field });  
               //选中的行值赋值给editIndex;  
               editIndex = index;  
           }  
       }