I'm trying to use extjs-touch drag & drop, and I can't have the event.stopPropagation() method working properly.
The live example is here : http://www.objectivegui.com/urbis10/index3.html. You should use it with Chrome or Ipad and try to drag one of the people icons in the white "workgroup" div.
The "workgroup" div correctly alerts the event, but the "company resources" root div receives the event too, as shown by the second alert.
The javascript code is here (and please excuse my poor competence with event handlers) :
onReady: function(){
new Ext.util.Draggable('miba', {
revert: true
});
new Ext.util.Draggable('cake', {
revert: true
});
new Ext.util.Droppable('workgroup', {
validDropMode: 'contains',
listeners: {
drop: function(droppable, element, e) {
e.stopPropagation();
e.preventDefault();
alert("Entity '" + element.el.id + "' was successfully moved to '" + droppable.el.id + "'.");
}
}
});
new Ext.util.Droppable('root', {
validDropMode: 'contains',
listeners: {
drop: function(droppable, element, e) {
alert("Entity '" + element.el.id + "' was successfully moved to '" + droppable.el.id + "'.");
}
}
});
}