PDA

View Full Version : Questions about the dragdrop



sj.wang
3 Apr 2013, 11:43 AM
Hi,I have two Panel, panel1 and panel2, panel2 in panel1, this is a nested relations,and its all have the dropZone.Now I set the dragZone on a tree, when drag and drop data panel1 (outside) can trigger events, panel2(inside) is can't.
I should how to solve?


sory,my English is not good.

????????????????????????????DragZone?DropZone???????????????????????????????????????????

slemmon
5 Apr 2013, 8:33 AM
I'm afraid it will be difficult to determine what is happening without a test case to show what you're doing currently. Can you post a code snippet to demonstrate what you're doing in your code?

sj.wang
5 Apr 2013, 10:50 PM
Thank you for your reply!
this is my code:

Ext.onReady(function() {
//Drag source
var source = Ext.create('Ext.tree.Panel', {
region : 'west',
title : 'Data',
width : 200,
root : {
text : 'Root',
expanded : true,
children : [ {
text : 'Data1',
leaf : true
}, {
text : 'Data2',
leaf : true
} ]
},
viewConfig:{
listeners:{
render:function(v){
v.dragZone = Ext.create('Ext.dd.DragZone', v.getEl(), {
getDragData : function(e) {
var sourceEl = e.getTarget(v.itemSelector, 5), d;
if (sourceEl) {
var record = v.getRecord(sourceEl);
if (!record.isLeaf()) {
return;
}
d = sourceEl.cloneNode(true);
d.id = Ext.id();
return v.dragData = {
sourceEl : sourceEl,
repairXY : Ext.fly(sourceEl).getXY(),
ddel : d,
data : record.data
};
}
},
getRepairXY : function() {
return this.dragData.repairXY;
}
});
}
}
}
});
//outside
var panel1 = Ext.create('Ext.panel.Panel', {
region : 'center',
title : 'panel1',
width : 500,
height : 300,
margin : 30,
listeners : {
render : function(panel) {
panel.dropTarget = Ext.create('Ext.dd.DropTarget', panel.body, {
notifyEnter : function(ddSource, e, data) {
panel.body.stopAnimation();
panel.body.highlight();
},
notifyDrop : function(ddSource, e, data) {
return true;
}
});
}
}
});
//inside
var panel2 = Ext.create('Ext.panel.Panel', {
title : 'panel2',
width : 250,
height : 150,
margin : 30,
listeners : {
render : function(panel) {
panel.dropTarget = Ext.create('Ext.dd.DropTarget', panel.body, {
notifyEnter : function(ddSource, e, data) {
panel.body.stopAnimation();
panel.body.highlight();
},
notifyDrop : function(ddSource, e, data) {
return true;
}
});
}
}
});
//Panel1 and panel2 is nested relations
panel1.add(panel2);
var layout = Ext.create('Ext.panel.Panel', {
height : 500,
width : 1000,
layout : 'border',
items : [ source, panel1 ],
renderTo : Ext.getBody()
});
});
Now this mouse enter to panel2,I want to put the data drop in panel2.but panel2 can't drop
42962