easyui-edatagrid.js实现回车键结束编辑功能的实例


Posted in Javascript onApril 12, 2017

easyui的可编辑表格并不具备回车事件。这让edatagrid在结束编辑时的操作很麻烦,除非你点击其他行,或者点出表格否则不会取消编辑行。

为了让结束编辑操作更简单些,我为每个单元格添加了回车事件,当回车时结束本行编辑,具体做法是重写edatagrid的onDblClickCell事件,如下:

onDblClickCell : function(index, field, value) {
 if (opts.editing) {
  $(this).edatagrid('editRow', index);
  focusEditor(field);
  //以下是我添加的代码
  var currentEdatagrid = $(this);
  $('.datagrid-editable .textbox,.datagrid-editable .datagrid-editable-input,.datagrid-editable .textbox-text').bind('keydown', function(e){
       var code = e.keyCode || e.which;
       if(code == 13){
       $(currentEdatagrid).datagrid('acceptChanges');
       $(currentEdatagrid).datagrid('endEdit', index);
       }
    });
  //添加代码结束
 }
 if (opts.onDblClickCell) {
  opts.onDblClickCell.call(target, index, field,value);
 }
},

也可以单独添加一个onEnterCell事件,在该事件中处理,灵活性更强。这样就可以调用onEnterCell:function(index){}。

以上这篇easyui-edatagrid.js实现回车键结束编辑功能的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Prototype Class对象学习
Jul 19 Javascript
javascript十个最常用的自定义函数(中文版)
Sep 07 Javascript
JavaScript关闭当前页面(窗口)不带任何提示
Mar 26 Javascript
js实现回放拖拽轨迹从过程上进行分析
Jun 26 Javascript
原生javascript实现拖动元素示例代码
Sep 01 Javascript
如何理解Vue的.sync修饰符的使用
Aug 17 Javascript
vue地区选择组件教程详解
May 04 Javascript
vue实现在一个方法执行完后执行另一个方法的示例
Aug 25 Javascript
微信小程序嵌入腾讯视频源过程详解
Aug 08 Javascript
node crawler如何添加promise支持
Feb 01 Javascript
es6函数之尾调用优化实例分析
Apr 25 Javascript
vue+echarts实现多条折线图
Mar 21 Vue.js
Vue生命周期示例详解
Apr 12 #Javascript
easyui关于validatebox实现多重规则验证的方法(必看)
Apr 12 #Javascript
easyui-datagrid特殊字符不能显示的处理方法
Apr 12 #Javascript
JavaScript数据结构中串的表示与应用实例
Apr 12 #Javascript
javascript数据结构之串的概念与用法分析
Apr 12 #Javascript
详解RequireJS按需加载样式文件
Apr 12 #Javascript
JS表格组件神器bootstrap table使用指南详解
Apr 12 #Javascript
You might like
php中长文章分页显示实现代码
2012/09/29 PHP
PHP register_shutdown_function()函数的使用示例
2015/06/23 PHP
CodeIgniter多语言实现方法详解
2016/01/20 PHP
php连接微软MSSQL(sql server)完全攻略
2016/11/27 PHP
Laravel中服务提供者和门面模式的入门介绍
2017/11/06 PHP
js类中获取外部函数名的方法与代码
2007/09/12 Javascript
JavaScript 动态将数字金额转化为中文大写金额
2009/05/14 Javascript
js图片向右一张张滚动效果实例代码
2013/11/23 Javascript
jquery map方法使用示例
2014/04/23 Javascript
详解JavaScript逻辑Not运算符
2015/12/04 Javascript
JavaScript判断按钮被点击的方法
2015/12/13 Javascript
JavaScript简单实现弹出拖拽窗口(一)
2016/06/17 Javascript
javascript 动态样式添加的简单实现
2016/10/11 Javascript
JS树形菜单组件Bootstrap TreeView使用方法详解
2016/12/21 Javascript
微信小程序中子页面向父页面传值实例详解
2017/03/20 Javascript
yarn的使用与升级Node.js的方法详解
2017/06/04 Javascript
EL表达式截取字符串的函数说明
2017/09/22 Javascript
javascript严格模式详解(含严格模式与非严格模式的区别)
2019/11/12 Javascript
ES6 Iterator遍历器原理,应用场景及相关常用知识拓展详解
2020/02/15 Javascript
python读取html中指定元素生成excle文件示例
2014/04/03 Python
Python使用htpasswd实现基本认证授权的例子
2014/06/10 Python
Python合并多个装饰器小技巧
2015/04/28 Python
python将字符串转换成数组的方法
2015/04/29 Python
Python3使用requests发闪存的方法
2016/05/11 Python
python利用不到一百行代码实现一个小siri
2017/03/02 Python
django中静态文件配置static的方法
2018/05/20 Python
python中对数据进行各种排序的方法
2019/07/02 Python
pytorch 实现删除tensor中的指定行列
2020/01/13 Python
美国领先的商务贺卡出版商:The Gallery Collection
2018/02/13 全球购物
德国价格合理的品牌商品购物网站:averdo
2019/03/21 全球购物
煤矿安全协议书
2014/08/20 职场文书
公安机关正风肃纪剖析材料
2014/10/10 职场文书
装修公司工程部经理岗位职责
2015/04/09 职场文书
2015年青年教师工作总结
2015/05/25 职场文书
爱护公物主题班会
2015/08/17 职场文书
mysql分表之后如何平滑上线详解
2021/11/01 MySQL