文档章节

编辑单元格

品先
 品先
发布于 2016/11/11 19:42
字数 636
阅读 12
收藏 0

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

本文转载自:http://blog.csdn.net/fxq8866/article/details/50533478

品先
粉丝 0
博文 34
码字总数 15445
作品 0
合肥
程序员
私信 提问
超级强大的DataGrid组件

DataGrid 组件允许用户显示和操作多列数据。 当 DataGrid 实例从单击或 Tab 键切换中获得焦点时,您可以使用以下按键来控制它: 键 说明 向下箭头 如果正在编辑单元格,插入点将移到单元格文...

Corey209
2012/09/22
493
0
C# winform DataGridView 属性说明

① 取得或者修改当前单元格的内容 ② 设定单元格只读 ③ 不显示最下面的新行 ④ 判断新增行 ⑤ 行的用户删除操作的自定义 ⑥ 行、列的隐藏和删除 ⑦ 禁止列或者行的Resize ⑧ 列宽和...

属性
2010/07/11
0
0
SlickGrid的自定义cell编辑器对象接口

一个功能强大的基于jQuery的grid控件SlickGrid的自定义单元格编辑器对象接口的详细定义:(翻译自http://wiki.github.com/mleibman/SlickGrid/writing-custom-cell-editors) 基本接口 functi...

Imy
2011/02/01
719
0
Ext GridPanel 设置点击次数打开可编辑单元格

Ext GridPanel 设置点击次数打开可编辑单元格 在页面中使用GridPanel显示表格,其中有单元格需要点击后变成可编辑状态。GridPanel默认是双击打开可编辑单元格,但是有时又需要单击来打开。这...

laowang2915
2017/08/03
0
0
Jupyter Notebook的使用

文章作者:Tyan 博客:noahsnail.com | CSDN | 简书 1. 介绍 Jupyter Notebook有两种不同的键盘输入模式。编辑模式允许输入代码/文本到一个单元格中,并以绿色单元格边框表示,此时命令模式的...

Quincuntial
2018/01/12
0
0

没有更多内容

加载失败,请刷新页面

加载更多

将key=value转成对象形式

var params = {};testParan.split(',').forEach(item =>{ var tmpArr = item.split('='); Vue.set(params, tmpArr[0].trim(), tmpArr[1].trim());});Vue.set(params, 'sql', sql);......

沉迷代码我爱学习
19分钟前
3
0
什么是分立器件

  分立器件被广泛应用到消费电子、计算机及外设、网络通信,汽车电子、led显示屏等领域。   半导体产业中有两大分支:集成电路和分立器件。   集成电路   集成电路(integrated circ...

仙溪
29分钟前
4
0
kibana rpm安装

https://www.elastic.co/guide/en/kibana/6.2/rpm.html 下载对应的版本wget https://artifacts.elastic.co/downloads/kibana/kibana-6.2.4-x86_64.rpm 安装 rpm -ivh kibana-6.2.4-x86_64......

看的最远的地方
32分钟前
3
0
高防CDN相比较于高防服务器,为何更加稳定?

对于DDoS攻击,那些已经做过网站、平台的人应该知道,DDoS攻击是非常可怕的,因为这种攻击本质上不能防御,或者DDoS攻击只能被减轻,不能完全消除。DDoS,意思是“分布式拒绝服务”。它是一种...

云漫网络Ruan
32分钟前
4
0
线程SuspendThread() ResumeThread()的使用

SuspendThread():挂起线程 If the function succeeds, the return value is the thread's previous suspend count; otherwise, it is (DWORD) -1. ResumeThread():启动线程 If the functio......

rainbowcode
33分钟前
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部