jquery list drag drop

Question

我有一个Jquery拖放列表，我想使用Jquery Ajax Post在MYSQL中立即更新。

因为我可以拖动列表（不止一个列表），我需要得到父ID之间的元素（父是列表类ID - 当拖动拖到）

当我从一个类拖/清单到另一个我一直在给原有ID ..

例如：

CAT 1 ------------ CAT 2

如果我是拖从东西CAT1到CAT2 - ID将是CAT1，而不是新的类别ID ...

我已经加入我的代码如下：

的Jquery：

<script src="js/jquery.min.js" type="text/javascript"></script> 
    <script src="js/jquery.ui.core.js"></script> 
    <script src="js/jquery.ui.widget.js"></script> 
    <script src="js/jquery.ui.mouse.js"></script> 
    <script src="js/jquery.ui.sortable.js"></script> 
<script> 
    $(function() { 
     $("#sortable1, #sortable2").sortable({ 
      connectWith: ".connectedSortable" 
     }).disableSelection(); 
    }); 
    </script> 


    <script type="text/javascript"> 
    $(document).ready(function(){ 
    $(".mouseup").mouseleave(function(){ 
    var sparent = $(this).parent().attr("id"); 
    alert(sparent); 
    }); 
    }); 
    </script> 

LIST HTML：

<div class="demo"> 
<div class="box"> 
<ul id="sortable1" class="connectedSortable"> 
    <li class="ui-state-default mouseup">Item 1</li> 
    <li class="ui-state-default mouseup">Item 2</li> 
</ul> 
</div> 
<div class="box"> 
<ul id="sortable2" class="connectedSortable"> 
    <li class="ui-state-highlight mouseup">Item 1</li> 
    <li class="ui-state-highlight mouseup">Item 2</li> 
</ul> 
</div> 
</div> 

任何帮助，将不胜感激。

预先感谢您！

Answer 1

你想要的是在这里： http://jqueryui.com/demos/draggable/#events

$("#sortable1, #sortable2").sortable({ 
    connectWith: ".connectedSortable", 
    stop: function(event, ui) { alert($(ui.item).parent().attr("id") } 
}).disableSelection(); 

配售代码在停止回调将允许你检查权限ID。

Answer 2

您需要处理的事件是received。

$(".connectedSortable").on("sortreceive", function(event, ui) { 
    alert(ui.item.parent()[0].id); 
    // also ui.sender will hold original list, from where element was taken 
}); 

编辑：取决于事实上，如果你需要处理时，只是重新排序项的情况下，也就是你拖动和相同的列表中掉落，或者你不打算使用received或stop事件。 received只会在您拖动到另一个列表的情况下触发。即使您将项目留在同一个列表中， stop也会触发。