Determine target of drag/drop

[psteeleMember]

Inside the ‘dragEnd’ event, how can I determine where the object was dragged (in terms of parent/child)?

Our treeview is built from a database with unique id’s for each node (which we set using the “id” property of our json datasource). At the end of the drag operation, I’d like to know what element was dragged (so I can get it’s unique id for database updates) as well as its new parent (again, so I can get it’s ID to “re-parent” the item in the database).

I’d also like to know the position within the new parent for ordering, but I think I can get that through an indexOf somehow (not sure — still trying to tackle that).

Any help is appreciated. Thanks.

[psteeleMember]

[Answering my own post but would like confirmation that this is the way to do it]

Seems like this works in the dragEnd event:

var element = $(event.args.originalEvent.element).parents('li:first');
alert('dragged id: ' + element.attr('id'));
alert('new parent id: ' + element.parents('li').attr('id'));
alert('position: ' + element.index());

[saragoParticipant]

I noticed that dragEnd event is raised before the dragging completes, so if I want to get the new data after the change – this event does not help me at all. Is there another way to get this information?

Thanks

[saragoParticipant]

It seems that there is not an event that is raises after drop – “dropEnd”. Please, add this feature in the next version…

[DimitarParticipant]

Hello sarago,

The dragEnd event is triggered after the order of items has been changed. Please take a look at the following example: http://jsfiddle.net/Dimitar_jQWidgets/jmapuLcf/. If you debug it, you will see that the method getItems called in the dragEnd event handler will contain the items in their new order.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts