无法在已删除字段之间删除元素

Question

我有一些可拖动的元素 我有一些丢弃的字段，我可以轻松地将元素放入可丢弃的区域。但无法将元素从一个已删除字段拖放到另一个字段

这里是 Jsfiddle Demo

看看小提琴是如何工作的

1. 点击两次添加div，添加两个灰色的div
2. 将绿色 div 拖到第一个灰色 div 上，效果很好
3. 当您尝试将绿色元素从第一个灰色 div 拖动到第二个灰色 div 时，您无法这样做，这是错误

这里是 Jquery

$(function () {
    $(".selectorField").draggable({
        containment: $('body'),
        helper: "clone",
        stack: "div",
        cursor: "move",
        cancel: null
    });

    function makeDraggable($sel) {
        $sel.draggable({
            containment: $('.droppedFields'),
            cursor: "move",
        });
        $sel.find('.resize_box').resizable({
            handles: {
                'e': '.ui-resizable-e'
            }
        });
    }

    var i = 1;
    $("#AddSec").click(function () {
        $("<div />", {
            "class": "wrapper"
        })
            .append($('<span />', {
            "class": "DelSection",
            "data-target": "#Section" + i
        }).html('(-)Remove'))
            .appendTo("#data");
        $("<div />", {
            "class": "SecStyle",
            id: "Section" + i
        })
            .append($("<div/>").attr('class', 'well droppedFields').droppable({

            accept: ":not(.not_clone)",

            drop: function (event, ui) {
                var draggable = ui.draggable;
                draggable = draggable.clone();
                draggable.addClass('not_clone');
                draggable.appendTo(this);
                $(ui.draggable).hide();


                draggable.click(function (e) {

                    if ($(this).hasClass('is_sort')) {
                        $('.selectorField').removeClass('is_sort');
                        e.preventDefault();
                        return;
                    }

                    if (!$(e.target).is('.ui-resizable')) {

                        // alert("First");
                        $(this).remove();
                        $(ui.draggable).show();
                    }
                });
            }
        }).resizable({
            handles: 'e'
        }))
            .appendTo("#data");
        $(".droppedFields").sortable({
            start: function () {
                $('.selectorField').addClass('is_sort');
            }
        }).disableSelection();
        i++;
    });
    var is_sort = false;

    //delete the columns from section

    //delete the section
    $("#data").on('click', '.DelSection', function () {
        var targetSection = $(this).data('target');
        $(targetSection).remove();
        $(this).parent().remove();
    });
});

Answer 1

通过改变解决了自己

$(".droppedFields").sortable({
            start: function () {
                $('.selectorField').addClass('is_sort');
            }
        }).disableSelection();

到

  $(".droppedFields").sortable({
                start: function () {
                    $('.selectorField').addClass('is_sort');
                }, 
           connectWith: ".droppedFields"
            }).disableSelection();

Demo Fiddle