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 相关文章推荐
javascript中的prototype属性实例分析说明
Aug 09 Javascript
JavaScript设计模式之观察者模式(发布者-订阅者模式)
Sep 24 Javascript
node.js中的fs.rename方法使用说明
Dec 16 Javascript
PHPMyAdmin导入时提示文件大小超出PHP限制的解决方法
Mar 30 Javascript
写给小白看的JavaScript异步
Nov 29 Javascript
vue一个页面实现音乐播放器的示例
Feb 06 Javascript
使用D3.js+Vue实现一个简单的柱形图
Aug 05 Javascript
vue3.0 CLI - 1 - npm 安装与初始化的入门教程
Sep 14 Javascript
JavaScript页面倒计时功能完整示例
May 15 Javascript
在vue中阻止浏览器后退的实例
Nov 06 Javascript
使用JavaScript计算前一天和后一天的思路详解
Dec 20 Javascript
webstorm建立vue-cli脚手架的傻瓜式教程
Sep 22 Javascript
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实现MVC开发得最简单的方法――模型
2007/04/10 PHP
如何使用PHP批量去除文件UTF8 BOM信息
2013/08/05 PHP
PHP时间和日期函数详解
2015/05/08 PHP
关于PHP定时发送服务的解决办法
2017/04/23 PHP
php面向对象的用户登录身份验证
2017/06/08 PHP
JavaScript 精粹读书笔记(1,2)
2010/02/07 Javascript
Jquery中给animation加更多的运作效果实例
2013/09/05 Javascript
Extjs4中Form的使用之本地hiddenfield
2013/11/26 Javascript
javascript之Array 数组对象详解
2016/06/07 Javascript
JavaScript比较当前时间是否在指定时间段内的方法
2016/08/02 Javascript
bootstrap导航、选项卡实现代码
2016/12/28 Javascript
angular.js指令中transclude选项及ng-transclude指令详解
2017/05/24 Javascript
seajs中模块依赖的加载处理实例分析
2017/10/10 Javascript
ReactNative中使用Redux架构总结
2017/12/15 Javascript
JavaScript 有用的代码片段和 trick
2018/02/22 Javascript
JS实现字符串去重及数组去重的方法示例
2018/04/21 Javascript
vue项目动态设置页面title及是否缓存页面的问题
2018/11/08 Javascript
babel7.x和webpack4.x配置vue项目的方法步骤
2019/05/12 Javascript
JS实现省市县三级下拉联动
2020/04/10 Javascript
纯JS实现五子棋游戏
2020/05/28 Javascript
python中Genarator函数用法分析
2015/04/08 Python
python如何重载模块实例解析
2018/01/25 Python
django orm 通过related_name反向查询的方法
2018/12/15 Python
python用fsolve、leastsq对非线性方程组求解
2018/12/15 Python
python面向对象法实现图书管理系统
2019/04/19 Python
python设计tcp数据包协议类的例子
2019/07/23 Python
树莓派4B安装Tensorflow的方法步骤
2020/07/16 Python
意大利巧克力店:Chocolate Shop
2019/07/24 全球购物
联谊活动策划书
2014/01/26 职场文书
《奇妙的国际互联网》 教学反思
2014/02/25 职场文书
党的群众路线教育实践活动公开承诺书
2014/03/28 职场文书
企业标语大全
2014/07/01 职场文书
年会邀请函范文
2015/01/30 职场文书
售后前台接待岗位职责
2015/04/03 职场文书
拾金不昧通报表扬范文
2015/05/05 职场文书
golang定时器
2022/04/14 Golang