PDA

View Full Version : Multiple Drag and Drop using Examples



elmi
10 Feb 2011, 5:40 AM
Hi,
I am a newbie to Sencha. I have modified your release and made three valid draggable and droppable (instead of one of of each). When I try to drag only the third droppable in working fine and other 2 droppables are reverting back to their original positions. Can you please help me rectify this issue.

Also I have made the droppables not to accept more than one dropplabes by the below method "droppable.disable();". Is this the right way ? Kindly help

Below in my js file:-

// Setup the Sencha Touch app.
function makeValidDraggable(id){
new Ext.util.Draggable(id, {
revert: true
})
}
function makeValidDroppable(id){
// Create a new Droppable for the div with an
// id of 'droppable'
new Ext.util.Droppable(id, {
// Change the validDropMode from the default of 'intersect' to
// 'contains' this ensures that a Draggable must be completed
// contained by the Droppable in order to perform a drop
validDropMode: 'contains',
listeners: {
drop: function(droppable, draggable, e) {
var id=draggable.el.id;
draggable.el.setHTML('Drp:'+id);
console.log('Drp:'+id);
droppable.disable();
}
}
})
}
Ext.setup({
icon: 'icon.png',
tabletStartupScreen: 'tablet_startup.png',
phoneStartupScreen: 'phone_startup.png',
glossOnIcon: false,
onReady: function(){
// Create a new draggable for the div with an
// id specified by parameter
makeValidDraggable('drag1');
makeValidDraggable('drag2');
makeValidDraggable('drag3');
// Create a new 'valid' droppable for the div with an
// id specified by parameter
makeValidDroppable('drop1');
makeValidDroppable('drop2');
makeValidDroppable('drop3');
}
})

24649
Regards,
Elmi..

mukund1a
15 Nov 2011, 2:25 AM
I think U shoud used group: attribute