jQuery UI拖放表单

Question

我正在做一个屏幕，用户可以在其中拖动项目并放入可放置字段。我正在使用jQuery用户界面。

此可拖动项是一个隐藏了输入的div。 可放置字段是一种形式。

我需要用户选择字段中的项目并将其提交给php代码。

但是，我遇到了三个问题。

1-当项目放在字段中时，我需要显示隐藏的输入，但是所有itens都是可见的，而不是选定的。

2-当该项目放在字段中时，我无法将其放回到可拖动列表中。

3-当可拖动的鼠标放在野外时，我无法在隐藏的营地中写作。

问题是我只需要选择可拖动的div并放入一个字段即可提交给表单。我认为这很容易，但是我遇到了麻烦。

请，您能给我些帮助吗？

谢谢。

我没有使用jQuery UI的经验。

$( function() {

    $( ".drag" ).draggable({

        containment: "document", 
        helper: "clone",
        cursor: "move"

    });
    $( "#drop" ).droppable({
        classes: {
        "ui-droppable-active": "custom-state-active"
      },
        drop: function (event, ui){
            $('.inputAtributo').css('display','block');
            adicionaAtributo(ui.draggable);
        },
        out: function (event, ui) {
        $(ui.draggable).fadeOut(1000, function () {
            $(this).remove();
            $(this).appendTo(".campo-inicial");
            $('.inputAtributo').css('display','none');
            $(this).fadeIn();
            $( ".drag" ).draggable({     
                containment: "document", 
                helper: "clone",
                cursor: "move"  
            });
        });
    }
    });

function adicionaAtributo($atributo){
    $atributo.appendTo('form');     
}

    });

我需要将可拖动的div提交到表单。