Tabla ordenable con Filas expandibles

Question

Soy un jquery/rails novato y tengo problemas para utilizar .sortable(). Tengo filas expandibles y parece que no puedo obtener el código correcto para que la fila oculta, es decir, la fila secundaria, se adhiera a la fila visible, es decir, a la fila principal. El código JS relevante:

(function($){ 
    $.fn.jSortable = function(){ 


    var element = this; 

    var fixHelper = function(e, ui) { 
     ui.children().each(function(){ 
      $(this).width($(this).width()); 
     }); 
     return ui; 
    }; 

    $(element).sortable({ 
     helper: fixHelper, 
     axis: "y", 
     cursor: "move", 
     items: "tr.odd2", 
     distance: "30" 

    }); 
    $(element).disableSelection(); 
}; 

})(jQuery); 

La fila principal tiene la clase odd2 y la fila secundaria tiene la clase secundaria.

¿Cuál es la forma correcta de bloquear las 2 filas juntas cuando se aplica .sortable()?

actualmente estoy usando los carriles 3.1.1 con jquery-rails 1.0.19

EDIT:

Aquí está el código HTML correspondiente

<table id="sortableTable"> 
    <tr class= 'headings'> 
     <th><%= sortable "number" %></th> 
     <th><%= sortable "customer_id" %></th> 
     <th><%= sortable "priority" %></th> 
     <th><%= sortable "quantity" %></th> 
     <th><%= sortable "due_date" %></th> 
     <th></th> 
    </tr> 

<% @jobs.each do |job| %> 
    <tr class= "odd2"> 
    <td><%= job.number %></td> 
    <td><%= job.customer %></td> 
    <td><%= job.priority %></td> 
    <td><%= job.quantity %></td> 
    <td><%= job.due_date %></td> 
    <td><%= button 'Edit', edit_job_path(job) %></td> 
    </tr> 

    <tr class= "child"> 
    <td><%= job.job_items %></td> 
    </tr> 
<% end %> 
</table> 

<%= javascript_tag do %> 
$(document).ready(function(){ 
    $('#sortableTable tbody').jSortable(); 
}); 

<% end %> 

EDIT 2: He actualizado mi aplicación a Rails 3.2.1 con jquery-rails 2.0.0

EDIT 3: Dado que nadie ha proporcionado una solución para una etiqueta de tabla en lugar de una div y todavía tengo que encontrar algo que se aplique a una tabla, estoy obligado a cambiar a divs.

Answer 1

parece que esto es lo que quiere: http://jqueryui.com/demos/sortable/#portlets

Si no es así, por favor, puesto que su HTML por lo que es más fácil ver lo que está tratando de hacer.

Específicamente, observe cómo el elemento ordenable es un div y tiene divs para niños.

<div class="portlet"> 
    <div class="portlet-header">Feeds</div> 
    <div class="portlet-content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit</div> 
</div>