How to reorder table rows (drag-and-drop) along with their sub rows
        Posted  
        
            by Eirik Johansen
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by Eirik Johansen
        
        
        
        Published on 2010-06-07T18:19:17Z
        Indexed on 
            2010/06/07
            18:22 UTC
        
        
        Read the original article
        Hit count: 274
        
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 !
© Stack Overflow or respective owner