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 相关文章推荐
使用JQuery和CSS模拟超链接的用户单击事件的实现代码
May 23 Javascript
js和jquery使按钮失效为不可用状态的方法
Jan 26 Javascript
JS烟花背景效果实现方法
Mar 03 Javascript
jQuery实现平滑滚动的标签分栏切换效果
Aug 28 Javascript
jquery获取所有选中的checkbox实现代码
May 26 Javascript
JavaScript微信定位功能实现方法
Nov 29 Javascript
vue2 自定义动态组件所遇到的问题
Jun 08 Javascript
js图片上传的封装代码
Aug 01 Javascript
对vue里函数的调用顺序介绍
Mar 17 Javascript
用Node编写RESTful API接口的示例代码
Jul 04 Javascript
详解vue中axios请求的封装
Apr 08 Javascript
JS数据类型分类及常用判断方法
Nov 19 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遍历并打印指定目录下所有文件实例
2014/02/10 PHP
PHP实现可添加水印与生成缩略图的图片处理工具类
2018/01/16 PHP
php使用QueryList轻松采集js动态渲染页面方法
2018/09/11 PHP
PHP发送邮件确认验证注册功能示例【修改别人邮件类】
2019/11/09 PHP
获取当前网页document.url location.href区别总结
2008/05/10 Javascript
JavaScript操作XML实例代码(获取新闻标题并分页,并分页)
2010/05/25 Javascript
jquery.simple.tree插件 更简单,兼容性更好的无限树插件
2010/09/03 Javascript
jQuery下扩展插件和拓展函数的写法(匿名函数使用的典型例子)
2010/10/20 Javascript
jquery下jstree简单应用 - v1.0
2011/04/14 Javascript
常用Extjs工具:Extjs.util.Format使用方法
2012/03/22 Javascript
JS中toFixed()方法引起的问题如何解决
2012/11/20 Javascript
JQuery 在线引用及测试引用是否成功
2014/06/24 Javascript
JQuery boxy插件在IE中边角图片不显示问题的解决
2015/05/20 Javascript
jquery调整表格行tr上下顺序实例讲解
2016/01/09 Javascript
一篇文章搞定JavaScript类型转换(面试常见)
2017/01/21 Javascript
深入理解AngularJS中的ng-bind-html指令
2017/03/27 Javascript
jQuery返回定位插件详解
2017/05/15 jQuery
浅析vue给不同环境配置不同打包命令
2018/08/17 Javascript
使用js实现一个简单的滚动条过程解析
2019/09/10 Javascript
快速解决layui弹窗按enter键不停弹窗的问题
2019/09/18 Javascript
Python实现的Kmeans++算法实例
2014/04/26 Python
Python中文竖排显示的方法
2015/07/28 Python
详解python进行mp3格式判断
2016/12/23 Python
Python 自动化表单提交实例代码
2017/06/08 Python
开源软件包和环境管理系统Anaconda的安装使用
2017/09/04 Python
python实现日常记账本小程序
2018/03/10 Python
python实现输入任意一个大写字母生成金字塔的示例
2019/10/27 Python
C#面试问题
2016/07/29 面试题
年度考核自我鉴定
2014/03/19 职场文书
面试自我评价范文
2014/09/17 职场文书
融资合作协议书范本
2014/10/17 职场文书
针对吵架老公保证书
2015/05/08 职场文书
党风廉政建设心得体会
2019/05/21 职场文书
Java使用httpRequest+Jsoup爬取红蓝球号码
2021/07/02 Java/Android
《进击的巨人》新联动CM 兵长强势出击兽巨人
2022/04/05 日漫
Sql Server 行数据的某列值想作为字段列显示的方法
2022/04/20 SQL Server