#8384 open feature ()

Opened June 06, 2012 03:24PM UTC

Last modified September 27, 2016 03:01PM UTC

Draggable+Sortable: make what is inserted configurable

Reported by: panzi Owned by:
Priority: minor Milestone: 2.0.0
Component: ui.draggable Version: 1.8.21
Keywords: Cc:
Blocked by: Blocking:
Description

Sometimes you don't want to paste a clone of the original item into the sortable, but something else. E.g. you might have some kind of toolbar from which you drag items into the list. In the list it then expands to "the real thing".

I made an ugly monkey patch to add such an feature, but it would be great if this would be included in jQuery UI. It is only an additional option, an tiny additional function (which handles the option to create the new element) and replacing $(self).clone()... at one point with a call to the function.

See: http://jsfiddle.net/SCqSV/

Attachments (0)
Change History (9)

Changed June 06, 2012 03:30PM UTC by scottgonzalez comment:1

The way this works is likely to dramatically change with the API redesign.

Changed June 06, 2012 03:44PM UTC by panzi comment:2

There is an API redesign underway? How will this all work in the new API and would it be possible to make something like this with the new API?

Changed June 06, 2012 03:56PM UTC by scottgonzalez comment:3

http://blog.jqueryui.com/2011/03/api-redesigns-the-past-present-and-future/

The API redesigns for interactions have not been announced yet. See http://wiki.jqueryui.com/Roadmap

Changed June 06, 2012 04:24PM UTC by panzi comment:4

What will this redesign mean? Will it then be possible to use a touch device for D'n'D? I need to make big hacks to enable this right now.

Changed June 06, 2012 04:50PM UTC by rdworth comment:5

Yes, part of the redesign is replacing the existing interaction base called 'mouse' with a device-independent base called 'interaction' that will support touch and mouse and other input devices. This work is being tracked at http://wiki.jqueryui.com/w/page/50166448/Interaction

Changed June 26, 2012 01:24AM UTC by scottgonzalez comment:6

type: enhancement → feature

Changed October 11, 2012 02:49PM UTC by scottgonzalez comment:7

milestone: 1.9.0 → 2.0.0

Changed October 28, 2012 09:17PM UTC by mikesherov comment:8

status: new → open

Changed September 27, 2016 03:01PM UTC by matt-hoskins comment:9

Looks like this ticket hasn't progressed in a while, but I do have another scenario to add.

Something like this would be very useful for me to work around a consequence of a change introduced with 1.12.0 which is causing me problems.

For various reasons I have a table which is collection of rows, where each row is a draggable. I have a helper function for those draggables which would wrap the clone the row in a new table element. I also have a sortable which is a table where the rows are the sortable items. The draggables are connected to that sortable. Now this used to work fine as when the draggable was dragged into a sortable the code would clone the original source draggable (in this case, a tr) into the sortable, so you get a new tr appended to the table:

this.instance.currentItem = $(that).clone().removeAttr("id").appendTo(this.instance.element).data("ui-sortable-item", true);

Unfortunately with 1.12.x it looks like the code has changed such that instead of cloning the source draggable, instead it just adds in the draggable helper:

sortable.currentItem = ui.helper.appendTo( sortable.element ).data( "ui-sortable-item", true );

As my helper has a table wrapping this results in a table being appended to a table (as the sortable is a table) which is rather undesirable!

Unfortunately because the connectToSortable plugin doesn't provide any hooks to control what gets added to the sortable when the draggable is dragged in then I can't tidily work around this at present. I see there is still an undocumented "toSortable" event triggered on the draggable though not long after the item gets added, so I may be able to use that to work around the issue, but it would be far easier if there was a hook to allow control over what gets added to the sortable when a connected draggable is dragged in!