1

コードサンプルに興味のある他の人のために、ここに実用的なソリューションを掲載すると思いました。

ドラッグ可能な各アイテムには、アイテム ID に設定された ID があります。ドラッグ可能なアイテムのソース ビューは次のとおりです。

<div id="item">
    <ul>
         <li class="list_none" id="15">
               Black phone
         </li>
    </ul>
</div>

「ドラッグ可能」にする jQuery スクリプトを次に示します。dmck の入力を反映するように更新しました。

$( "#item li" ).each(function(index, value) {
    $this = $(value);
    var drag_id = $this.attr("id");
    $this.draggable({
            appendTo: "body",
            helper: "clone"
    }).data("drag_id", drag_id)
});

drag_id 値を droppable に渡すのは問題でしたが、現在は機能しています。

$( "#group ul" ).droppable({
    activeClass: "ui-state-default",
    hoverClass: "ui-state-hover",
    accept: ":not(.ui-sortable-helper)",
    drop: function( event, ui ) {
        // alert(ui.draggable.data("drag_id")); // left this alert in for other tinkerers
        $('input[name=user_id]').val(ui.draggable.data("drag_id"));
        $(this).closest('form').submit();
        return false;
        $( "<li></li>" ).text( ui.draggable.text() ).appendTo( this );
   }

ありがとう。

4

1 に答える 1

4

jQuery each を使用して、すべての要素をバインドします。

$( "#item li" ).each(function(index, value) {

    $this = $(value);

    var itemid = $this.attr("id");

    $this.draggable({
            appendTo: "body",
            helper: "clone"
    }).data("itemid", itemid)
});
于 2012-06-22T20:47:56.263 に答える