I'm wondering if there is a good library or script out there that trivializes drag and drop functionality for table rows in Javascript? Really the only requirement I have is that rows must be draggable within the table itself, but also to other tables on the page. I'm not too familiar with JQuery or Javascript itself, so I'd like to try and find a self contained library or script that makes the drag and drop portion pretty simple so I don't have to write the code myself. I understand JQuery is a nice Javascript library, does it have this kind of functionality?
Add a comment
|
4 Answers
JQuery UI does it for you. Create table with tbody and thead tags. Then set for tbody the some id and use jquery ui:
$( "#table_tbody" ).sortable();
$( "#table_tbody" ).disableSelection();
Here is what you need, I edited example in a link as in Bob's answer, but for tables: Table example And code view: code view
1 Comment
Mark Jin
What if I want to drag a column not a row?
How's this for ya?
http://www.isocra.com/2008/02/table-drag-and-drop-jquery-plugin/
2 Comments
Nate32
I saw that one but unfortunately it doesn't support dragging and dropping from one table to another, which is one of my requirements.
Syd
One comment on the isocra implementation. It supports only simple drag and drop elements. If your row contains the entire image, it will not work.
Sounds like you want jQuery UI and the Sortable Connects demo
Most well known javascript libraries available today have a drag & drop functionality.
You could give a try to:
- Jquery
- Prototype + Scriptaculous: http://wiki.github.com/madrobby/scriptaculous/draggable
