惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

J
Java Code Geeks
MongoDB | Blog
MongoDB | Blog
B
Blog
博客园 - Franky
博客园 - 三生石上(FineUI控件)
A
About on SuperTechFans
N
Netflix TechBlog - Medium
MyScale Blog
MyScale Blog
阮一峰的网络日志
阮一峰的网络日志
美团技术团队
Vercel News
Vercel News
云风的 BLOG
云风的 BLOG
WordPress大学
WordPress大学
S
SegmentFault 最新的问题
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
宝玉的分享
宝玉的分享
小众软件
小众软件
P
Proofpoint News Feed
aimingoo的专栏
aimingoo的专栏
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
月光博客
月光博客
酷 壳 – CoolShell
酷 壳 – CoolShell
D
DataBreaches.Net
量子位

博客园 - 疯狂秀才

Angular 开发小妙招1:提交表单数据验证不通过,更改输入组件的样式 疯狂秀才权限管理系统,开源了 - 疯狂秀才 - 博客园 edge 浏览器中数字显示为链接 JSON.net 在实体类中自定义日期的格式 让easyui 的alert 消息框中的确定按钮支持空格键 修复百度编辑器(UM)禁用时上传图片按钮还可点击的BUG; EasyUI datagrid : 启用行号、固定列及多级表头后,头部行号位置单元格错位的问题 【转】Chrome 控制台不完全指南 AngularJS 之 Factory vs Service vs Provider【转】 【转】NuGet.org 无法访问的解决方法 jquery easyui 1.4.1 验证时tooltip 的位置调整 jquery easyui 1.4.1 API( CHM版) 扩展 easyui-tabs 插件 关闭标签页方法 easyui layout 折叠后显示标题 easyui 中Datagrid 控件在列较多且无数据时,列显示不全的解决方案 jQuery EasyUI 1.3.4 API CHM版下载 扩展 easyui 控件系列:为datagrid 增加过滤行 丰富Easyui 的插件 - lookup 分享: 自用 webstorm 6 仿 sublimeText2 的代码风格
为easyui datagrid 添加上下方向键移动
疯狂秀才 · 2014-01-11 · via 博客园 - 疯狂秀才

将以下脚本保存为 easyui-datagrid-moverow.js

var DatagridMoveRow = (function($){

    function DatagridMoveRow(gridTarget){
        this.el = gridTarget;
        this.$el = $(this.el);
        this.rowIndex = -1;
        this.rowsCount = this.$el.datagrid('getData').rows.length;
        return this;
    }

    DatagridMoveRow.prototype = {
        getRowindex: function(){
            var selectRowIndex = this.$el.datagrid('getSelectedIndex');
            if(selectRowIndex == -1){
                this.rowIndex = 0 ;
            }else{
                this.rowIndex = selectRowIndex;
            }
        },
        moveUp: function(){

            this.getRowindex();

            if(this.rowIndex ==0){
                return false;
            }

            var i = --this.rowIndex;
            if(i>-1){
                this.$el.datagrid('selectRow',i);
            }else{
                this.rowIndex = 0;
            }

            return false;
        },
        moveDown: function (){
            this.getRowindex();

            if(this.rowIndex == this.rowsCount -1 ){
                return false;
            }
            var i = ++this.rowIndex;
            this.$el.datagrid('selectRow',i);
        }
    }

    return DatagridMoveRow;

})(jQuery);

定义调用方法:

var moveRow = function(target){
        var options = $(target).datagrid('options');

        if(options.moveRow){
            var dmr = new DatagridMoveRow(target);
            $(document).on('keydown.datagridrow',function(e){
                if(e.keyCode == 38){ //up
                    dmr.moveUp();
                }else if(e.keyCode == 40) {// down
                    dmr.moveDown();
                }
            });
        }
    }

在初始化datagrid 的 onLoadSuccess 事件中

onLoadSuccess:function(){
   // 上下方向键移动
   moveRow(this);       
}

这样就OK啦!