GRID拖拽行的实例代码


Posted in Javascript onJuly 18, 2013

---------------------GRID拖拽行的实例代码  单行拖拽---------------------------------------

//创建第一个GRID
var firstGrid = new Ext.grid.GridPanel({
ddGroup : 'secondGridDdGroup',//这里是第二个GRID的ddGroup
store       : firstGridStore,
enableDragDrop : true,//True表示启动对于GridPanel中选中行的拖动行为
……其他属性省略
});
//创建第二个GRID
var secondGrid = new Ext.grid.GridPanel({
ddGroup : 'firstGridDdGroup',//这里是第一个GRID的ddGroup
store       : secondGridStore,
enableDragDrop : true,//True表示启动对于GridPanel中选中行的拖动行为
……其他属性省略
});
//创建第一个GRID的ddGroup
var firstGridDropTargetEl = firstGrid.getView().el.dom.childNodes[0].childNodes[1];
var firstGridDropTarget = new Ext.dd.DropTarget(firstGridDropTargetEl, {
ddGroup    : 'firstGridDdGroup',//和第二个GRID的ddGroup相同
copy        : true,
notifyDrop : function(ddSource, e, data){
   function addRow(record, index, allItems) {
    var foundItem = secondGridStore.find('name', record.data.name);
    if (foundItem == -1) {
     firstGridStore.add(record);
     firstGridStore.sort('name', 'ASC');
     ddSource.grid.store.remove(record);
    }
   }
   Ext.each(ddSource.dragData.selections ,addRow);
   return(true);
}
)};
//创建第二个GRID的ddGroup
var secondGridDropTargetEl = secondGrid.getView().el.dom.childNodes[0].childNodes[1];
var secondGridDropTarget = new Ext.dd.DropTarget(secondGridDropTargetEl,{
ddGroup : 'secondGridDdGroup',//和第一个GRID的ddGroup相同
copy        : true,
notifyDrop : function(ddSource, e, data){
   function addRow(record, index, allItems) {
    var foundItem = secondGridStore.find('name', record.data.name);
    if (foundItem == -1) {
     secondGridStore.add(record);
     secondGridStore.sort('name', 'ASC');
     ddSource.grid.store.remove(record);
    }
   }
   Ext.each(ddSource.dragData.selections ,addRow);
   return(true);
}
});
Javascript 相关文章推荐
jquery win 7透明弹出层效果的简单代码
Aug 06 Javascript
详解Javascript 装载和执行
Nov 17 Javascript
javascript 闭包详解
Jul 02 Javascript
jquery实现美观的导航菜单鼠标提示特效代码
Sep 06 Javascript
利用JS屏蔽页面中的Enter按键提交表单的方法
Nov 25 Javascript
vue单页应用中如何使用jquery的方法示例
Jul 27 jQuery
H5实现仿flash效果的实现代码
Sep 29 Javascript
vue 下列表侧滑操作实例代码详解
Jul 24 Javascript
node全局变量__dirname与__filename的区别
Jan 14 Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
Jul 26 jQuery
使用Angular material主题定义自己的组件库的配色体系
Sep 04 Javascript
详解小程序如何动态绑定点击的执行方法
Nov 26 Javascript
去掉gridPanel表头全选框的小例子
Jul 18 #Javascript
gridpanel动态加载数据的实例代码
Jul 18 #Javascript
javaScript NameSpace 简单说明介绍
Jul 18 #Javascript
JS获取鼠标坐标的实例方法
Jul 18 #Javascript
非常好用的JsonToString 方法 简单实例
Jul 18 #Javascript
转义字符(\)对JavaScript中JSON.parse的影响概述
Jul 17 #Javascript
JS随机生成不重复数据的实例方法
Jul 17 #Javascript
You might like
树型结构列出指定目录里所有文件的PHP类
2006/10/09 PHP
php中判断字符串是否全是中文或含有中文的实现代码
2011/09/16 PHP
PHP Post获取不到非表单数据的问题解决办法
2018/02/27 PHP
有关于JS辅助函数inherit()的问题
2013/04/07 Javascript
解析javascript 浏览器关闭事件
2013/07/08 Javascript
js获取url传值的方法
2015/12/18 Javascript
JavaScript驾驭网页-CSS与DOM
2016/03/24 Javascript
Bootstrap + AngularJS 实现简单的数据过滤字符查找功能
2017/07/27 Javascript
vue+iview写个弹框的示例代码
2017/12/05 Javascript
浅析Angular19 自定义表单控件
2018/01/31 Javascript
vue 全选与反选的实现方法(无Bug 新手看过来)
2018/02/09 Javascript
小程序实现人脸识别功能(百度ai)
2018/12/23 Javascript
vue实现路由不变的情况下,刷新页面操作示例
2020/02/02 Javascript
JavaScript装箱及拆箱boxing及unBoxing用法解析
2020/06/15 Javascript
js闭包的9个使用场景
2020/12/29 Javascript
Python列表list数组array用法实例解析
2014/10/28 Python
谈谈Python进行验证码识别的一些想法
2016/01/25 Python
python开发之list操作实例分析
2016/02/22 Python
django 创建过滤器的实例详解
2017/08/14 Python
python正则中最短匹配实现代码
2018/01/16 Python
利用Python将文本中的中英文分离方法
2018/10/31 Python
Python3安装psycopy2以及遇到问题解决方法
2019/07/03 Python
Python bisect模块原理及常见实例
2020/06/17 Python
通过实例简单了解Python sys.argv[]使用方法
2020/08/04 Python
使用Python操作MySQL的小技巧
2020/09/10 Python
python之pygame模块实现飞机大战完整代码
2020/11/29 Python
Mamas & Papas沙特阿拉伯:英国最受欢迎的婴儿品牌
2017/11/20 全球购物
普通院校学生的自荐信
2013/11/27 职场文书
酒吧副总经理岗位职责
2013/12/10 职场文书
工厂总经理岗位职责
2014/02/07 职场文书
尊师重教演讲稿
2014/09/04 职场文书
简易离婚协议书(范本)
2014/10/25 职场文书
工人先锋号申报材料
2014/12/29 职场文书
员工年终考核评语
2014/12/31 职场文书
2019年教师入党申请书
2019/06/27 职场文书
Spring Boot实现文件上传下载
2022/08/14 Java/Android