Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Drag and Drop Table Rows Using Javascript

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?

like image 501
Nate32 Avatar asked Oct 20 '09 16:10

Nate32


People also ask

How do you drag and drop rows?

Drag the rows or columns to another location. Hold down OPTION and drag the rows or columns to another location. Hold down SHIFT and drag your row or column between existing rows or columns. Excel makes space for the new row or column.


1 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

like image 141
maximus Avatar answered Nov 02 '22 01:11

maximus