jquery UI sortable: how to leave the original visible until the drop?

Question

In the standard behavior demonstrated at http://jqueryui.com/demos/sortable/ when you drag an item in the list a placeholder element is displayed where the item would be dropped.

However, the original location of the item to be dropped is not indicated.

I would like to leave the original location visible until the drop, so that the visual feedback is analogous to the way the original is left in place for the "semi-transparent clone" option depicted at http://jqueryui.com/demos/draggable/#visual-feedback

Is there any way I can do this with sortable?

Thanks!

Answer 1

So one approach that seems to work (thought it's definitely a hack) is to pass the option

start: function (e, ui) { ui.item.show();}

which unhides the automatically hidden original (ui.item).

And, more generally, one can use the start function to modify the item.

Answer 2

The option helper: 'clone' will leave your original item in place, while creating a new DOM element that is actually dragged around by the mouse. (Additionally, you use the option opacity: 0.7 to create the "semi-transparent" effect on the helper.)

I'm not sure if you'll need this, but if using a clone doesn't remove the item automatically from the list, you can then use the remove event to delete the item that was dragged out from the DOM entirely.