将以下脚本保存为 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啦!

为easyui datagrid 添加上下方向键移动的更多相关文章

  1. EasyUI DataGrid 添加 Footer

    做后台管理界面时,EasyUI 的 DataGrid 经常会被用到,有时候一些总的统计数据不合适放在数据表格里,需要单独显示,这时候就可以放在Footer中显示而不必另外布局. 该怎么给 DataGr ...

  2. EasyUI datagrid添加右键菜单项

    js代码 //动态加载数据表格 function InitData() { $('#grid').datagrid({ url: '/Home/Query?r=' + Math.random(), / ...

  3. EasyUI DataGrid 添加排序

    这个事例演示了如何在点击列头的时候排序DataGrid中全部的列可以通过点击列头被排序.你可以定义可以被排序的列.默认的,列不能被排序除非你设置sortable属性为TRUE,下面是例子:标记 < ...

  4. easyui datagrid 每条数据后添加操作按钮

    easyui datagrid 每条数据后添加“编辑.查看.删除”按钮 1.给datagrid添加操作字段:字段值 <table class="easyui-datagrid" ...

  5. ASP.NET MVC5+EF6+EasyUI 后台管理系统(82)-Easyui Datagrid批量操作(编辑,删除,添加)

    前言 有时候我们的后台系统表单比较复杂,做过进销存或者一些销售订单的都应该有过感觉 虽然Easyui Datagrid提供了行内编辑,但是不够灵活,但是我们稍微修改一下来达到批量编辑,批量删除,批量添 ...

  6. [转载]EasyUI中数据表格DataGrid添加排序功能

    我们这里演示的是EasyUI数据表格DataGrid从服务器端排序功能,因为觉的本地数据排序没有多大的作用,一般我们DataGrid不会读取全部数据,只会读取当前页的数据,所以本地数据排序也只是对当前 ...

  7. Easyui datagrid 怎么添加操作按钮,rowStyler

    说明:本篇文章主要是展示怎么设置easyUI datagrid的格式,包括行样式和列样式,以及添加操作按钮列 开发环境 vs2012  asp.net mvc4 c# 1.效果图 3.HTML代码 & ...

  8. EasyUI datagrid 日期时间格式化

    EasyUI datagrid中显示日期时间时,会显示为以下不太直观的数值: 添加以下JavaScript脚本,然后在field中添加 formatter: DateTimeFormatter 即可. ...

  9. 让easyui datagrid支持bootstrap的tooltip

    让easyui datagrid支持bootstrap的tooltip 发表于 下午 1:53 by ylpro.net & 分类 Java. Easyui在1.3.3版本之前是不支持tool ...

随机推荐

  1. html的层叠次序---真没有想象的简单

    学习资料1: http://www.cnblogs.com/mind/archive/2012/04/01/2198995.html 学习资料2:http://www.cnblogs.com/weib ...

  2. Sandcastle----强大的C#文档生成工具

    最近客户索要产品的二次开发类库文档,由于开发过程中并没有考虑过此类文档,而且项目规范比较,持续时间比较长,经手人比较多,还真是麻烦,如果人工制作文档需要是一个比较大的工程.还好有这个文档生成工具,能够 ...

  3. Sql Server之旅——第十一站 简单说说sqlserver的执行计划

    我们知道sql在底层的执行给我们上层人员开了一个窗口,那就是执行计划,有了执行计划之后,我们就清楚了那些烂sql是怎么执行的,这样 就可以方便的找到sql的缺陷和优化点. 一:执行计划生成过程 说到执 ...

  4. R语言中的循环函数(Grouping Function)

    R语言中有几个常用的函数,可以按组对数据进行处理,apply, lapply, sapply, tapply, mapply,等.这几个函数功能有些类似,下面介绍下这几个函数的用法. Apply 这是 ...

  5. Windows服务调试小结(附Demo)

    本文版权归mephisto和博客园共有,欢迎转载,但须保留此段声明,并给出原文链接,谢谢合作. 阅读目录 介绍 搭建环境 调试方式 Demo下载 本文版权归mephisto和博客园共有,欢迎转载,但须 ...

  6. Nginx问题定位之监控进程异常退出

    nginx在运行过程中是否稳定,是否有异常退出过?这里总结几项平时会用到的小技巧. 1. 在error.log中查看是否有signal项,如果有,看看signal是多少. 比如,这是一个异常退出的情况 ...

  7. Linux IPC Pipe

    mkfifo() //创建有名管道(FIFO special file),创建完了就像普通文件一样open(),再读写,成功返回0,失败返回-1设errno.VS$man 3 mkfifo #incl ...

  8. 【转载国外好文】代工开发一个iOS应用没有那么容易

    导读:这是来自新加坡的 iOS 开发者 Kent Nguyen 发表在1月底的一篇博文.这篇吐槽文在 iOS 开发圈子里流传甚广,从原文150多个评论就可见一斑,现翻译如下. 让我们开门见山吧:做一个 ...

  9. 报表session与应用session常识普及

    1. 报表session与应用session 报表集成到项目中可能会有一个疑问就是系统应用和报表应用在一个web服务器下,那系统session和报表session是不是一个session呢?如果不是那 ...

  10. Quantum Bogo sort浅谈

    1.普通的猴子排序(bogo sort) 猴子排序百科 en.wikipedia.org/wiki/Bogosort 不停的随机打乱序列,然后检查,直到排好序 复杂度O(n*n!) while not ...