0

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

因为我可以在列表之间拖动元素（多个列表），所以我需要获取父 ID（父是列表类别 ID - 可拖动对象被拖动到的位置）

当我从一个类别/列表拖到另一个时，我总是得到前一个 ID..

例如：

类别 1 ------------ 类别 2

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

我在下面添加了我的代码：

查询：

<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>

列表 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>

任何帮助，将不胜感激。

先感谢您！

4

2 回答 2

2

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

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

将您的代码放在停止回调中将允许您检查正确的 ID。

于 2012-08-08T23:20:56.477 回答
0

您需要处理的事件是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即使您将项目留在同一个列表中，也会触发。

于 2012-08-08T23:22:53.497 回答