demo中有row editing

项目中发现个cell editing,但是有bug,修改好了

主要实现功能:单击数据表格单元格,编辑单元格数据

js代码如下:

$.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);
var ed = $(this).datagrid('getEditor', param);
if (ed) {
if ($(ed.target).hasClass('textbox-f')) {
$(ed.target).textbox('textbox').focus();
} else {
$(ed.target).focus();
}
}
for (var i = 0; i < fields.length; i++) {
var col = $(this).datagrid('getColumnOption', fields[i]);
col.editor = col.editor1;
}
});
},
enableCellEditing: function (jq) {
return jq.each(function () {
var dg = $(this);
var opts = dg.datagrid('options');
opts.oldOnClickCell = opts.onClickCell;
opts.onClickCell = function (index, field) {
if (opts.editIndex != undefined) {
if (dg.datagrid('validateRow', opts.editIndex)) {
dg.datagrid('endEdit', opts.editIndex);
opts.editIndex = undefined;
} else {
return;
}
}
dg.datagrid('selectRow', index).datagrid('editCell', {
index: index,
field: field
});
opts.editIndex = index;
opts.oldOnClickCell.call(this, index, field);
}
});
}
});

$(function () {
//注意,不能多次绑定,否则死循环
$('#dg').datagrid('enableCellEditing');
})

效果图:

easyui datagrid 单元格编辑(cell editing)的更多相关文章

  1. EasyUI Datagrid 单元格编辑

    3:对于单元格的编辑 $('#Units').datagrid({ pageNumber: 1, //url: "@ViewBag.Domain/Paper/GetQuestionUnit& ...

  2. easyui datagrid 单元格编辑 即见即所得,MVC菜单维护,扫描增加

    效果如图: 参见 EasyUI 官方 Demo 及文档 @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Lay ...

  3. easyui datagrid 单元格 编辑时 事件 修改另一单元格

    //datagrid 列数据 $('#acc').datagrid({ columns : [ [ { field : 'fee_lend', title : '收费A', width : 100, ...

  4. easyui datagrid 单元格编辑 自动聚焦 、全选

    $.extend($.fn.datagrid.methods, { editCell: function (jq, param) { return jq.each(function () { var ...

  5. EasyUI datagrid单元格文本超出显示省略号,鼠标移动到单元格显示文本

    nowrap : true;  是前提 $('#×××').datagrid({ nowrap : true,//设置为true,当数据长度超出列宽时将会自动截取 }); 省略号样式: <sty ...

  6. easyui datagrid单元格实现溢出文本显示省略号的效果。

    Css .datagrid-btable .datagrid-cell{padding:6px 4px;overflow: hidden;text-overflow:ellipsis;white-sp ...

  7. easyui datagrid 单元格加进度条(亲测可用)

    {field: 'DataItemNum', title: '数据完整度', width: 100, formatter: function (v, r, i) { var p = (v / 27) ...

  8. Datagrid扩展方法InitEditGrid{支持单元格编辑}

    //-----------------------------------------------------------------/******************************** ...

  9. Datagrid扩展方法onClickCell{easyui-datagrid-扩充-支持单元格编辑}

    //-----------------------------------------------------------------/******************************** ...

随机推荐

  1. flume中HdfsSink参数说明

    flume到hdfsSink: type hdfs path 写入hdfs的路径,需要包含文件系统标识,比如:hdfs://namenode/flume/webdata/ 可以使用flume提供的日期 ...

  2. js中表单数据序列化方式

    一共有以下三种: var obj1 = $('#queryForm').serialize(); var obj2 = $('#queryForm').serializeArray(); var ob ...

  3. 编译安装Mysql与管理(十四)

    [教程主题]:编译安装Mysql与管理 [课程录制]: 创E [主要内容] [1]什么是Mysql MyQL是一个开放源码的小型关系型数据库管理系统,开发者为瑞典MySQL AB公司.目前MySQL被 ...

  4. Android Studio 学习笔记(1)

    最近从Eclipse转到Android Studio IDE,很多东西需要学习,本文是个记录. 项目结构 在Anroid Studio 中,一个Project 包括多个Module,每个Module下 ...

  5. Git 执行更改

    Jerry 克隆库,他决定实现基本字符串操作.于是,他创建文件string.c,在添加内容到 string.c 会这个样子. #include <stdio.h> int my_strle ...

  6. display:box的兼容写法

    .box{ /* display */ display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -o-box; ...

  7. mongo 杀掉慢的程序killMyRunningOps("12.23.32.21") #####这个是客户端的ip

    mongodb运维(3) db.currentOp与db.killOp命令 2018.08.12 23:55 113浏览  字号 好久没更新mongo运维这块知识了,这次介绍 db.currentOp ...

  8. gitlab安装与配置(Centos6.8)

    0.Centos7请参照官方文档 https://about.gitlab.com/installation/#centos-7 1. Install and configure the necess ...

  9. android 判断左右滑动,上下滑动的GestureDetector简单手势检测

    直接加入监听GestureDetector放在需要判断滑动手势的地方: import android.app.Activity; import android.os.Bundle; import an ...

  10. 用source函数代替繁冗的R语言打包过程

    用source函数代替繁冗的R语言打包过程 经过初级的学习和使用R语言之后我们渐渐的开始动手写自己的R语言小程序,这些小程序因为和自己的工作非常契合而变得通用性不是那么强.因此,要让它们成为一个独立的 ...