Welcome 微信登录

首页 / 脚本样式 / JavaScript / GRID拖拽行的实例代码

---------------------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);
}
});