5

私はjquery/rails newbieですが、.sortable()を使用するのに問題があります。展開可能な行があり、隠れた行、つまり子の行が表示される、つまり親の行を保持するための適切なコードを取得できないようです。関連するJSコード:展開可能な行付きのソート可能なテーブル

(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()が適用されているときに2行を一緒にロックする適切な方法は何ですか?私は私のアプリを更新しています。ここ

<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は、関連するhtmlです:

私は現在1.0.19が

EDITはjqueryのレールとレール3.1.1を使用していますRails 3.2.1 with jquery-rails 2.0.0

EDIT 3:誰もdivの代わりにテーブルタグの解を提供していないので、テーブルに適用されるものをまだ見つけていないので、私はdivに変更を余儀なくされました。

答えて

1

が、これはあなたが望むものであるようだ:あなたがやろうとしているかを確認することが容易であるのでhttp://jqueryui.com/demos/sortable/#portlets

ない場合は、あなたのHTMLを投稿してください。

具体的には、ソート可能なアイテムがdivであり、子にdivがあることに注意してください。

+0

jqueryについての知識が不足して申し訳ありませんが、ポートレットはdivで動作する必要がありますか?あなたの例から、私はテーブル、親の行、隠し行に切り替えることができますか? –

+0

テーブルにこれをどのように適用するかを誰も知らないので、私はこれを使うことができるようにdivに変更する必要があります。答えてくれてありがとう。 –

関連する問題