How to reorder table rows (drag-and-drop) along with their sub rows
- by Eirik Johansen
I have a table which looks like this (simplified for the example):
<table>
<tr class="lvl_1">
<td>
Level 1
</td>
</tr>
<tr class="lvl_2">
<td>
Level 2
</td>
</tr>
<tr class="lvl_3">
<td>
Level 3
</td>
</tr>
<tr class="lvl_1">
<td>
Level 1
</td>
</tr>
<tr class="lvl_2">
<td>
Level 2
</td>
</tr>
<tr class="lvl_3">
<td>
Level 3
</td>
</tr>
The content in the rows with the lvl_3 class are children of the previous lvl_2 row, and the lvl_2 rows are children of the previous lvl_1.
Had the data been a list, it would have looked something like this:
Level 1
-- Level 2
---- Level 3
Level 1
-- Level 2
---- Level 3
I'm not looking to implement drag-and-drop sorting functionality, make it possible to rearrange the level 1 and two rows. The tricky part is that once I start moving a row, the corresponding children (and grand-children, if any) should move along with it.
Is this even possible with the current markup, or do I have to rearrange the code?
Thanks in advance !
