首页 > 解决方案 > jQuery Sortable 如何获取新的父数据 ID

问题描述

我正在使用 jQuery sortable 来管理多级类别。我已经在网上搜索了有关如何获取拖动项目的新父 ID 的答案。任何帮助表示赞赏。

http://johnny.github.io/jquery-sortable

这是我到目前为止所拥有的

var group = $("ol.cat-list").sortable({
group: 'serialization',
delay: 500,
onDrop: function ($item, container, _super) {
    // console.log($item.data('id'));// drop Source

    //get the new parent id // target

    var data = group.sortable("serialize").get();

    var jsonString = JSON.stringify(data);

    $('#nestable-output').text(jsonString);
    _super($item, container);
}
});

HTML

<ol class="cat-list dd-list">
<li class="dd-item dd3-item" data-id="1">
    <div class="dd-handle dd3-handle"></div>
    <div class="dd3-content">Women</div>
    <ol class="dd-list">
        <li class="dd-item dd3-item" data-id="2">
            <div class="dd-handle dd3-handle"></div>
            <div class="dd3-content">Apparel</div>
        </li>
    </ol>
</li>
<li class="dd-item dd3-item" data-id="3">
    <div class="dd-handle dd3-handle"></div>
    <div class="dd3-content">Lingerie</div>
</li>
</ol>

标签: jqueryjquery-ui-sortable

解决方案


您可以通过项目找到父级并获取其 ID。在 onDrop 处理程序中尝试以下代码:

console.log($item.closest('.cat-list').data('id'));


推荐阅读