如何關閉使用jQueryUI排序的排序？

Question

我已經實現了jQueryUI可排序列表，它的工作非常好。在某個時間點，我希望禁用進一步的排序並保持原樣，保持原樣，無需用戶修改。

它試圖這樣的東西：

$('.sortable').sortable('disable'); 

這：

$('.sortable').each(function() { $(this).sortable('disable'); }); 

和：

$('.sortable').disable(); 

和：

$('.sortable').cancel(); 

和所有這些的各種組合。一切都沒有成功。

誰能告訴ne 正確的方法 ™要做到這一點嗎？

更新：我正在使用jQuery 1.3.2和jQueryUI 1.7.2。一個可能的問題可能是我在頁面上有兩個獨立的可排序列表，所以我有sortable1和sortable2類。我實際上做：

$('.sortable2').sortable('disable'); 

UPDATE2：問題是使用.sortable代替#sortable的我。現在一切正常。

Answer 1

第一種方法是documentation中給出的示例。我剛剛用我自己的項目中的一個進行了測試，並且工作正常。你正在使用哪個版本的jQuery和jQuery UI？我分別有1.3.2和1.7.2。

Answer 2

$(ui.sender).sortable("disable") 

Answer 3

$(".selector").sortable("disable");

從http://api.jqueryui.com/sortable/#option-disabled

Answer 4

我是在調試的過程：

1. 點擊進行排序
2. 完成（排序禁用）
3. 點擊使可再次排序沒有工作
4. 解決方案/解決方法：將禁用選項設置爲false明確

http://plnkr.co/edit/uX6cNNiYoejYqwQicEhg?p=preview

function sortableEnable() { 
    $("#sortable").sortable(); 
    $("#sortable").sortable("option", "disabled", false); 
    // ^^^ this is required otherwise re-enabling sortable will not work! 
    $("#sortable").disableSelection(); 
    return false; 
    } 
    function sortableDisable() { 
    $("#sortable").sortable("disable"); 
    return false; 
    } 

希望有所幫助。

Answer 5

感謝米哈爾

我做了一個版本列出了可以是排序或編輯。

至少對我很有用！

function sortableEnable() { 
     $("ul").sortable(); 
     $("ul").sortable("option", "disabled", false); 
     $("li").attr("contentEditable","false"); 
     $("li").css("cursor","move"); 
     return false; 
    } 

    function sortableDisable() { 
     $("ul").sortable("disable"); 
     $("li").attr("contentEditable","true"); 
     $("li").css("cursor","default"); 
     return false; 
    } 

    $(function() { 
     sortableEnable(); 
    }); 

Answer 6

雖然我之前的建議帖子很有用，但他們並沒有解決我試圖實現的目標。我想打開和關閉多個區域的排序，並添加使內容可以再次選擇的功能。

這裏是我使用的代碼：

function AddSortable() { 

    $("ul").sortable({ 
     connectWith: "ul", 
     disabled: false 
    }).disableSelection(); 

    return false; 
}; 

function RemoveSortable(){ 

    $("ul").sortable({ 
     disabled: true 
    }).enableSelection(); 

    $("li").attr("contentEditable","true"); 

    return false; 
} 

Answer 7

要禁用sortable()可以使用

$(".sortable").sortable("disable");

要切換啓用/ id爲上一個按鈕，單擊禁用toggleButton

$('#toggleButton').click(function() { 
    //check if sortable() is enabled and change and change state accordingly 
    // Getter 
    var disabled = $(".sortable").sortable("option", "disabled"); 
    if (disabled) { 
    $(".sortable").sortable("enable"); 
    } 
    else { 
    $(".sortable").sortable("disable"); 
    } 
});