Drag and drop forcing dynamically added elements

[RhysParticipant]

The result of a drag and drop in my app is to a target new elemtents dynamically i.e. $(event.context).after(newHTMLelements);

newHTMLelements has a div with the class “.configletSpacer”

These newly created elements also have the class to be the target of a drag drop. Unfortuntely these will not be recorgnised as droppable areas unless I register them again. Where jqxDragDropParams is the params for this drag and drop

var jqxDragDropParams = {
dropTarget: “.configletSpacer”,
feedback:’clone’,
revert:true,
onDropTargetEnter: function(event) {
$(event.context).addClass(“configletSpacerHover”);
},
onDropTargetLeave: function(event) {
$(event.context).removeClass(“configletSpacerHover”);
},

etc…

onTargetDrop: function (event) {
$(event.context).after(newHTMLelements);
$(‘.configletToolboxItem’).jqxDragDrop(jqxDragDropParams);
}
}

$(‘.configToolboxItem’).jqxDragDrop(jqxDragDropParams);

However when I do this the shape that I dragged doesn’t go back to its starting point and is stuck with the newly created ones.

[HristoParticipant]

Hello Rhys,

Please, take a look at this example:
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxdragdrop/defaultfunctionality.htm?light
Also, I would like to suggest you look at this topic:
http://www.jqwidgets.com/community/topic/bind-functions-to-dragdrop-appended-clones/

Best Regards,
Hristo Hristov

jQWidgets team
http://www.jqwidgets.com

[Author]

Posts