easyui datagrid 单元格编辑(cell editing)
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)的更多相关文章
- EasyUI Datagrid 单元格编辑
3:对于单元格的编辑 $('#Units').datagrid({ pageNumber: 1, //url: "@ViewBag.Domain/Paper/GetQuestionUnit& ...
- easyui datagrid 单元格编辑 即见即所得,MVC菜单维护,扫描增加
效果如图: 参见 EasyUI 官方 Demo 及文档 @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Lay ...
- easyui datagrid 单元格 编辑时 事件 修改另一单元格
//datagrid 列数据 $('#acc').datagrid({ columns : [ [ { field : 'fee_lend', title : '收费A', width : 100, ...
- easyui datagrid 单元格编辑 自动聚焦 、全选
$.extend($.fn.datagrid.methods, { editCell: function (jq, param) { return jq.each(function () { var ...
- EasyUI datagrid单元格文本超出显示省略号,鼠标移动到单元格显示文本
nowrap : true; 是前提 $('#×××').datagrid({ nowrap : true,//设置为true,当数据长度超出列宽时将会自动截取 }); 省略号样式: <sty ...
- easyui datagrid单元格实现溢出文本显示省略号的效果。
Css .datagrid-btable .datagrid-cell{padding:6px 4px;overflow: hidden;text-overflow:ellipsis;white-sp ...
- easyui datagrid 单元格加进度条(亲测可用)
{field: 'DataItemNum', title: '数据完整度', width: 100, formatter: function (v, r, i) { var p = (v / 27) ...
- Datagrid扩展方法InitEditGrid{支持单元格编辑}
//-----------------------------------------------------------------/******************************** ...
- Datagrid扩展方法onClickCell{easyui-datagrid-扩充-支持单元格编辑}
//-----------------------------------------------------------------/******************************** ...
随机推荐
- C# .net微信开发,开发认证,关注触发消息,自动应答,事件响应,自定义菜单
成为开发者 string[] ArrTmp = { "token", Request["timestamp"], Request["nonce&quo ...
- python多线程同步机制Semaphore
#!/usr/bin/env python # -*- coding: utf-8 -*- """ Python 线程同步机制:Semaphore "" ...
- JS实现IE下打印和打印预览
http://blog.csdn.net/rongyongfeikai2/article/details/8460598 ——————————————————————————————————————— ...
- 【转】Smartphone--Android真机管理平台
背景 最近在工作中发现几个问题: 作为测试人员,在做产品兼容性测试时,发现手上的测试设备总是不够用,但是可能其他同事的设备在闲置着: 作为Android和H5开发人员,如果测试同事发现一个兼容性的bu ...
- Linux 条件变量函数signal和wait补充
pthread_cond_wait必须放在pthread_mutex_lock和pthread_mutex_unlock之间,因为他要根据共享变量的状态来觉得是否要等待,而为了不永远等待下去所以必须要 ...
- bom头解释方法和去掉方法
什么是bom头? 在utf-8编码文件中BOM在文件头部,占用三个字节,用来标示该文件属于utf-8编码,现在已经有很多软件识别bom头,但是还有些不能识别bom头,比如PHP就不能识别bom头,这也 ...
- altium designer 软件常用技巧总结(实时更新)
1.在使用altium designer画PCB时,在PCB界面画线找不到焊盘的中心点,将输入法切换到英文状态,按键盘D---O---勾选snap to object hotspots即可. 2.想高 ...
- android AlertDialog.Builder
AlertDialog的构造方法全部是Protected的,所以不能直接通过new一个AlertDialog来创建出一个AlertDialog. 要创建一个AlertDialog,就要用到AlertD ...
- 关于Unity中顶点片元Shader实例
补充 float4 fixed4 _Time 1: float4是内置向量 (x, y, z, w); float4 a; 访问单独成员a.x, a.y, a.z, a.w;2: fixed4 是内置 ...
- 谈谈mongodb,mysql的区别和具体应用场景
最近对数据库比较感兴趣,于是就去研究了下部分相关热门的数据库. MySQL 关系型数据库. 在不同的引擎上有不同 的存储方式. 查询语句是使用传统的sql语句,拥有较为成熟的体系,成熟度很高. 开源数 ...