javascript - Behaviors of JQuery sortable and draggable -
i have 2 draggable objects 'field' , 'container' , sortable object 'ui-main'. want drag 2 above objects 'ui-main', , allow add objects 'container', creating nested sortable form.
here demo: https://jsfiddle.net/tblaziken/a2qbnygb/1/
the javascript far:
$('.ui-select .ui-select-item').draggable({ revert : "invalid", helper: 'clone', connecttosortable : '.ui-sortable' }); $( ".ui-sortable" ).sortable({ connectwith: '.ui-sortable', placeholder: 'ui-hovering' });
the problem can add or move new object ui-main
, 2 existed ui-container
objects, unable newly created ui-container
. makes existed , newly created ones different , how fix it?
for me in jsfiddle works expected. however, use clone helper, not give full control on happens when clone. jquery's clone() function expects 2 parameters.
.clone( [withdataandevents ] [, deepwithdataandevents ] )
so have same events on every element either clone them yourself, setting both params true, or bind/unbind events again every newly added object.
Comments
Post a Comment