Question

我有一个可排序的div容器，每个容器都包含一个用于删除自身的按钮。此按钮调用一个从DOM中删除div容器的函数。一切都很好，直到我开始拖动并重新排序可排序的项目。现在删除的元素没有显示在GUI中（这是预期的），但是检查可排序数组似乎表明它仍然存在。

如何在移除过程中正确更新此阵列？或在分拣过程中。任何帮助将不胜感激。

以下是我的javascript。

$(function() {

    // Make Cron Jobs Sortable
    $("#controlContainer").sortable({
            items: "> div:not(#controlHeader), serialize",
            create: function(event, ui) {
                    cronJobOrder = $(this).sortable("toArray",{attribute: "id"});
            },
            update: function(event, ui) {
                    cronJobOrder = $(this).sortable("toArray",{attribute: "id"});
            }
    });

});

然后我的功能

// the variable being passed in is the "Delete" button reference, that way it can find the div container it's in.
function deleteCronJob(cronJob) {

    var confirmation = window.confirm("Are You Sure?");

    if (confirmation) {
            $(cronJob).parents(".cronJobElement:eq(0)").fadeOut("medium", function() {
                    // Remove Item from cronJobOrder array
                    cronJobOrder.splice(cronJobOrder.indexOf($(this).attr("id")),1);
                    // Remove CronJob from View
                    $(this).attr("id").remove();
            });
    } else {
            return null;
    }

}

Answer 1

我为你准备了一个简单的小提琴。将可排序元素警告为数组（以及单击删除按钮后的更新）。围绕它构建你的东西。

http://jsfiddle.net/K3Kxg/

function sortableArrayAlert() {
    sortableArray = $('li').toArray();
    alert(sortableArray);
}

$(function(){
    sortableArrayAlert();
    $('ul').sortable();
    $('a').click(function(e){
        e.preventDefault();
        $(this).parent().remove().then(sortableArrayAlert());
    });
});

使用Button从可排序列表中删除项目

1 个答案: