Javascript 如何拖动&；放下桌子？

我遵循了这一点

太棒了

我让它用于列表，但我一直在尝试使它用于表，更具体地说，是在局部视图中呈现的表

<table id="habits" data-update-url="<%= sort_habits_url %>">
  <% @habits.each do |habit| %>
    <tbody id="habit_<%= habit.id %>">
      # 2 tr's & 7 td's
    </tbody>
  <% end %>
</table>

---

如果您试图处理多个DOM，则不能使用DOM ID。因此，需要按类替换ID

使用多个tbody并在每个tbody内分拣TR：

---

另外，如果您绑定

，谢谢Aron！所以我这样做是因为我希望整个表移动
。这使我能够拖动所有表，但现在它们不会在当前位置之外的任何其他位置下降。由于某种原因，如果我这样做
，即使
tbody
包围着它们，表行也会被拆分，不会一起拖动。我不明白为什么它不能像你的那样为我工作。谢谢你的澄清：]我现在对它有了更好的理解。不过，我仍然无法将拖动放到新位置。当它落下时，它会回到原来的位置。我现在有了
，它解决了拆分问题：]即使我使用了：
$（function（）{$（“.sortable_bodys”）.sortable（）；$（“.sortable_bodys”）.disableSelection（）；）
或我的原始
jQuery->$（“.sortable_body”）.sortable（轴：“y”更新：->$.post（$（this.data（'update-url'），$（this.sortable（'serialize'））我对rails没有经验，生成的html与此类似：？一张桌子里有多个桌子吗？
<table id="habits" data-update-url="<%= sort_habits_url %>">
  <tbody id="habit_<%= habit.id %>">
    # 2 tr's & 7 td's
  </tbody>
</table>

jQuery ->
  $('#habits').sortable(
    axis: 'y'
    update: ->
      $.post($(this).data('update-url'), $(this).sortable('serialize'))
  );

<div class="sortable_tables">
    <table class="sortable_bodys">
        <tbody class="sortable_trs">
          <tr class="sortable_tds">
              <td>ID 1</td>
              <td>Item Name 1</td>
              <td>Action</td>
          </tr>
          <tr>