允许在可放置事件上创建的项目可拖动答案

【问题标题】：Allowing Items created on droppable event be draggable允许在可放置事件上创建的项目可拖动
【发布时间】：2016-09-19 13:43:04
【问题描述】：

我正在开发一个自定义工作流样式的应用程序。我正在使用 jQuery UI 作为拖放工具包。

在放置一个项目时，我正在渲染一个引导面板，其中包含各种项目（取决于放置了什么）。

现在，我想做的是允许这些面板在放置区域内再次可拖动，但我似乎无法实现。

以下是指向 html 要点的链接。忽略链接我的东西，这是我正在研究的另一个方面。理想情况下，对象可以拖动到解决方案 div 中的任何位置。

https://gist.github.com/ajberry/0ab2c0adca4f92855b26b63f929b108d

我假设这是愚蠢的，我尝试了以下方法但没有成功：

$( ".panel-default" ).draggable();

我认为这将允许每个面板都可以拖动。我猜这与我的可丢弃事件或其他事情有关。

问候

【问题讨论】：

您是否检查了您想要可拖动的元素（例如，.panel-default）以查看是否添加了可拖动类？
确实，它没有添加类。问题是我需要在 drop 事件上为面板提供可拖动属性（因为它们没有在页面加载时呈现）。
我可以发布答案吗？

标签： javascript jquery jquery-ui draggable

【解决方案1】：

我在 drop 事件上添加了可拖动属性。在此之前，对象不存在，因此无法应用它。

function handleDropEvent( event, ui ) {
  var rownum = $("#solution .panel-default").length;
  console.log(rownum);
  var draggable = ui.draggable;
  var mytype = draggable.attr('class');
  if (!(mytype.includes("panel-default"))){
    renderChildControls(draggable.attr('id'), rownum)
    }
   $('.panel-default').draggable();

}

【讨论】：