如何在JQuery Sortable上执行重置

时间:2012-12-12 18:55:16

标签: jquery jquery-ui-sortable

我正在使用JQuery Sortable。我想知道在经过多次尝试后,是否有可能将可排序控件恢复到原始状态,类似于表单重置。 “取消”选项似乎只影响最后一次排序尝试而不是所有这些。

4 个答案:

答案 0 :(得分:19)

我个人喜欢这样做:

$("#sortable").sortable({config...});
var cache = $("#sortable").html();

重置

$("#sortable").html(cache).sortable("refresh");

我尝试使用.clone()和.children()甚至$(“#sortable> *),但是找到缓存.html()的最佳选择。

在我的情况下,我有两个连接列表。一个包含用户可以排序或删除的当前项目以及用户可以从中获取以添加到“当前项目”列表的另一个可用项目列表。我需要一种方法将所有东西重置为原始状态。以上工作很棒。

答案 1 :(得分:2)

存储对原始元素顺序的引用,然后使用它来重新排序它们。

var sortableElements = $("#sortable div");
$("#sortable").sortable();

现在,当您想要恢复原始排序顺序时,只需将div附加到#sortable元素。

$("#sortable").append(sortableElements);

答案 2 :(得分:1)

您可以在准备好文档时缓存父文件的副本,并在重置时将其恢复。

例如,如果<ul class="parent">是您的可排序元素:

var sortableCache;
$(document).ready(function() {
    ...
    $('ul.parent').sortable({ ... });
    ...
    sortableCache = $('ul.parent').clone(true);
});

重置后,您可以执行以下操作:

$('ul.parent').replaceWith(sortableCache);

答案 3 :(得分:1)

这是一种简单的方法

$( "#sortable" ).sortable( "cancel" );