Question

字段：http://jsfiddle.net/johndavemanuel/htLx358f/17/

$(document).ready(function(){

    // Sort the parents
    $(".sortable").sortable({
        containment: "parent",
        items: "> div",
        handle: ".move",
        tolerance: "pointer",
        cursor: "move",
        opacity: 0.7,
        revert: 300,
        delay: 150,
        dropOnEmpty: true,
        placeholder: "movable-placeholder",
        start: function(e, ui) {
            ui.placeholder.height(ui.helper.outerHeight());
        }
    });

    // Sort the children
    $(".group-items").sortable({
        containment: "document",
        items: "> div",
        connectWith: '.group-items'
    });

})

我有3个DIV作为父级，并且可以排序他们里面还有其他DIV作为孩子，

我工作得很好，我可以对父母和孩子进行分类，我的问题是我如何才能像这样获得所有他们的“序列化”职位

父母2

孩子1

孩子4

父母1

孩子2

5岁儿童

父母3

孩子3

6岁儿童

我将使用它来保存他们的位置，以便当用户回来时会像这样

任何帮助将不胜感激。

Answer 1

function createArrayFromSortableList() {
    var sortables = $(".group-caption");
    sortables.each(function() {
        var fields = [];
        $(this).find('div.group-item.field').each(function() {
            fields.push({
                id: $(this).attr("data-id"),
                sectionID: $(this).closest(".group-caption").find('.section-title').attr("data-id"),
                fieldName: $.trim($(this).find(".field-name").text().replace(/[\t\n]+/g, ' ')),
                fieldPosition: $(this).closest(".group-items").attr("data-column")
            });

        });
        sections.push({
            id: $(this).find('.section-title').attr("id"),
            sectionName: $(this).find('.section-title').text(),
            zfields: fields
        });


    });
    console.log(sections);
    console.log(JSON.stringify(sections));
}

输出：

jQuery UI Sortable获取位置父级和子级

1 个答案: