Draggable 连接到 sortable答案

【问题标题】：Draggable connected to sortableDraggable 连接到 sortable
【发布时间】：2014-06-16 14:03:24
【问题描述】：

我希望能够将项目从一个 Infragistics DataGrid 拖到另一个，同时 Destination 网格中的项目也是可排序的。

很遗憾，我无法使用 jsfiddle，因为我无法使用那里的基础设施控件。

$("[id*=sourceGrid] [id*=dataTbl] tbody tr").draggable({
   helper: "clone",
   revert: "invalid",
   connectToSortable: '[id*=destination]'                   
});

$("[id*=destinationGrid]").sortable({
   cursor: 'move',
   helper: fixHelperModified,    
   revert: true,
   items: "[id*=container] [id*=dataTbl] tbody tr:not(.placeholder)",                
   receive: function (event, ui) {                    
      var grid = $IG.WebDataGrid.find("destinationGrid");                   
      $sentence = $(ui.item).find("td").eq(0).html();
      var row = new Array(Math.floor((Math.random() * 100) + 1), $sentence, $order);
      grid.get_rows().add(row);                  
  }
});

问题是：当我将项目从 sourceGrid 拖放到destinationGrid 时，我不希望将可拖动对象放置到新网格中 - 我只想使用接收函数在网格中创建一个新行可拖动元素的值。现在，我得到了两个 - 新创建的 gridRow 和删除的项目。我怎样才能防止这种情况发生？

【问题讨论】：

你试过什么？将“helper”方法更改为 original 然后 remove() on drop 怎么样？
对不起，忘了说。我需要“克隆”行为。我不想移动，但将项目从源克隆到目标，并且仍然在源中。当我remove()接收事件中的ui.item时，我删除了sourceGrid中的原始行。这种行为很奇怪，我不明白为什么 ui.item 是我拖动的原始元素，而不是克隆的占位符。
您是否尝试过将您的sourceGrid 也设为sortable()？另外，在receive 事件中，您可以console.log ui.helper 吗？

标签： javascript jquery jquery-ui jquery-ui-draggable jquery-ui-sortable

【解决方案1】：

您可以在 beforeStop 事件中捕获复制的项目。

var newItem;

$(".list").sortable({
  connectWith: ".list",
  beforeStop: function (event, ui) { 
      newItem = ui.item;
  },
  receive: function(event,ui) {
      $(newItem).doSomething();
  }
});

此答案的参考和信用：https://stackoverflow.com/a/5864644/3523694

【讨论】：