如何在两个容器之间拖放时找到索引？

Question

我想在容器之间执行Jquery拖放选项。但是当它掉线时我无法找到物品的确切索引。虽然在容器内做它的罚款。对于每个容器，其起始索引为0.这就是问题所在。

我的代码如下：

 <% all_tasks.each do |due_date, tasks| %>

 <h3 class="task_active task_plus_ico">
  <%=Date.today.to_s == due_date.to_s ? t("Due Today") : t(due_date_format[0]).concat("," + due_date_format[1])%>
 </h3>
 <div class="task_column_details sortable" style="display:none;">
 <% tasks.each do |t| %>
 <p><%= t.name %></p>
 <%end%>
</div>
 <%end%>

我的Jquery代码如下：

  $( ".sortable" ).sortable({
  revert: true,
  connectWith  : ".sortable",
  update: function(event, ui) { 
  alert(ui.item.index()) // its giving index starting from 0 for each container. but i want continuous index
  },

用户界面如下所示：

请帮我查找索引或容器名称。

Answer 1

如果我理解正确，当你从第一个容器掉到第二个容器时，你想得到被删除项目的索引，作为第一个容器中的项目数+第二个容器中的项目索引。

你可以使用这样的东西。 .sortable('toArray')将以容器形式返回容器中的项目。 ui.sender指的是项目被拖动的第一个容器。

$('.sortable').sortable({
    connectWith: '.sortable',
    update: function(event, ui) {
      var draggedto = this.id;
      var draggedFrom = $(ui.sender).attr("id");
      var totalIndex = $(ui.sender).sortable('toArray').length + ui.item.index();

    console.log({
      from: draggedFrom,
      to: draggedto,
      index: ui.item.index(),
      totalIndex: totalIndex
    });
  }
});

你需要检查ui.sender是否为null。