如何将id变量添加到jquery draggable项?

时间:2012-06-22 19:54:30

标签: jquery jquery-ui

我以为我会把这个工作解决方案放在其他对代码示例感兴趣的人身上。

每个可拖动项目的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 );
   }

感谢。

1 个答案:

答案 0 :(得分:4)

使用jQuery来绑定每个元素:

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

    $this = $(value);

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

    $this.draggable({
            appendTo: "body",
            helper: "clone"
    }).data("itemid", itemid)
});