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 相关文章推荐
JavaScript基本对象
Jan 11 Javascript
JavaScript Event学习第三章 早期的事件处理程序
Feb 07 Javascript
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
Mar 23 Javascript
jQuery中调用WebService方法小结
Mar 28 Javascript
jquery获取焦点和失去焦点事件代码
Apr 21 Javascript
jQuery获取URL请求参数的方法
Jul 18 Javascript
基于javascript实现tab切换特效
Mar 29 Javascript
axios对请求各种异常情况处理的封装方法
Sep 25 Javascript
使用ECharts实现状态区间图
Oct 25 Javascript
Nuxt.js实战和配置详解
Aug 05 Javascript
js实现tab栏切换效果
Aug 02 Javascript
vue-cli打包后本地运行dist文件中的index.html操作
Aug 12 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根据IP判断地区名信息的示例代码
2014/03/03 PHP
php cli换行示例
2014/04/22 PHP
快速解决PHP调用Word组件DCOM权限的问题
2017/12/27 PHP
JQuery 插件模板 制作jquery插件的朋友可以参考下
2010/03/17 Javascript
javascript 动态修改样式和层叠样式表代码
2010/04/27 Javascript
javascript dom代码应用 简单的相册[firefox only]
2010/06/12 Javascript
css transform 3D幻灯片特效实现步骤解读
2013/03/27 Javascript
容易造成JavaScript内存泄露几个方面
2014/09/04 Javascript
node爬取微博的数据的简单封装库nodeweibo使用指南
2015/01/02 Javascript
JavaScript获取各大浏览器信息图示
2015/11/20 Javascript
JS中this上下文对象使用方式
2016/10/09 Javascript
Bootstrap DateTime Picker日历控件简单应用
2017/03/25 Javascript
vue2.0实现分页组件的实例代码
2017/06/22 Javascript
基于Bootstrap模态对话框只加载一次 remote 数据的解决方法
2017/07/09 Javascript
JavaScript 中定义函数用 var foo = function () {} 和 function foo()区别介绍
2018/03/01 Javascript
JS/HTML5游戏常用算法之路径搜索算法 A*寻路算法完整实例
2018/12/14 Javascript
Angular6新特性之Angular Material
2018/12/28 Javascript
react-intl实现React国际化多语言的方法
2020/09/27 Javascript
如何编写一个 Webpack Loader的实现
2020/10/18 Javascript
[02:07]2018DOTA2亚洲邀请赛主赛事第三日五佳镜头 fy极限反杀
2018/04/06 DOTA
[00:18]天涯墨客三技能展示
2018/08/25 DOTA
Python多线程编程(八):使用Event实现线程间通信
2015/04/05 Python
Python压缩解压缩zip文件及破解zip文件密码的方法
2015/11/04 Python
分析python动态规划的递归、非递归实现
2018/03/04 Python
对Tensorflow中权值和feature map的可视化详解
2018/06/14 Python
Django开发中的日志输出的方法
2018/07/02 Python
CSS3实现王者匹配时的粒子动画效果
2019/04/12 HTML / CSS
老总助理工作岗位职责
2014/02/06 职场文书
未婚证明书模板
2014/10/08 职场文书
店铺转让协议书
2014/12/02 职场文书
幽灵公主观后感
2015/06/09 职场文书
新娘婚礼致辞
2015/07/27 职场文书
给校长的建议书作文300字
2015/09/14 职场文书
导游词之上海杜莎夫人蜡像馆
2019/11/22 职场文书
基于Redis位图实现用户签到功能
2021/05/08 Redis
Java完整实现记事本代码
2022/06/16 Java/Android