jQuery draggable table elements jQuery draggable table elements jquery jquery

jQuery draggable table elements


There is a way to make table rows draggable with JQuery UI too.All you need to do is set the helper option to a function returning a new div with a table inside that will host the row you are dragging like:

helper: function(event){return $('<div class="drag-cart-item"><table></table></div>').find('table').append($(event.target).closest('tr').clone()).end();},

Thx to David Petersen for the tip: http://blog.petersendidit.com/post/drag-table-row-to-a-div-with-jquery/


If you have truly tabular data, you should stick with table indeed.

And if you want to drag rows within a table, this JQuery + "draggable row table" library works perfectly in FireFox3


Just in case anyone makes the same mistake I did:

If you want to be able to reorder TRs inside a table by dragging them around, .sortable is what you need rather than .draggable

Just me?