Sortable table with expandable Row

我是jquery/rails的新手，我在使用.sortable（）時遇到了問題。我有可擴展的行，我似乎無法得到正確的代碼隱藏的行，即子行，堅持與可見，即父行。相關的JS代碼：Sortable table with expandable Row

(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);

父行具有類odd2，子行具有類子級。

當應用.sortable（）時，將兩行鎖定在一起的正確方法是什麼？

我目前使用jQuery的護欄護欄3.1.1 1.0.19

編輯：

下面是相關的HTML

<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 %>

編輯2：我有我的應用程序更新， Rails的3.2.1與jQuery的鐵軌2.0.0

編輯3：由於沒有人提供瞭解決方案的表標籤，而不是一個div，我還沒有找到任何適用於表，我是被迫改變爲divs。

來源

2012-02-17 Julian G.

看來，這是你想要什麼：http://jqueryui.com/demos/sortable/#portlets

如果沒有，請把你的HTML，使其更容易看到你正在嘗試做的。

具體來說，請注意可排序項目是如何分區和具有兒童的div。

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

來源

2012-02-17 17:38:08 Wilhelm

對於我對jquery的知識缺乏感到抱歉，但該portlet是否需要在div上執行？從你的例子，我可以切換到表，父行，隱藏行嗎？ – 2012-02-17 21:01:58

由於沒有人知道如何將其應用於表格，因此我必須更改爲div以便我可以使用它。謝謝你的回答。 – 2012-02-22 21:04:41

Sortable table with expandable Row

回答

相關問題