連接可排序列表與禁用項目

Question

我使用this可縮寫列表，我想使用兩個連接的可排序列表與禁用項目。

不幸的是它不起作用。 任何人都可以幫助我嗎？

<section> 
    <h1>Connected Sortable Lists</h1> 
    <ul id="sortable4" class="connected sortable list"> 
     <li>Item 1 
     <li>Item 2 

    </ul> 
    <ul id="sortable5" class="connected sortable list"> 
     <li class="disabled">Item 21 
     <li class="highlight">Item 22 

    </ul> 
</section> 

<script> 
    $(function() {  
     $('#sortable5').sortable({ 
      items: ':not(.disabled)' 
     }); 

     $('#sortable4, #sortable5').sortable({ 
      connectWith: '.connected' 
     }); 
    }); 
</script> 

Answer 1

正如我在我上面的評論中提到的，我相信你只需要有一個sortable函數。這大概應該工作這樣：

<script> 
    $(function() {  
     $('#sortable4, #sortable5').sortable({ 
      connectWith: '.connected', 
      items: ':not(.disabled)' 
     }); 
    }); 
</script> 

Answer 2

<script> 
$('ul.sortable').sortable().bind(
    'sortupdate', function() {      
     var dataIDList = $('ul.sortable li').map(
      function(){ 
       return $(this).attr("data-id"); 
      } 
     ).get().join(","); 

     $.post(
      'sort_save.php',{ idlist: dataIDList }, function(data){ 
       alert('ok!' + data); 
      } 
     ); 
    } 
);  

$(function() {  
    $('#sortable4, #sortable5').sortable({ 
     connectWith: '.connected', 
     items: ':not(.disabled)' 
    }); 
}); </script> 

Answer 3

如果你想使用兩種功能，你可以將它們定義如下

$('#sortable4').sortable({ 
     connectWith: '#sortable5', 
     items: ':not(.disabled)' 
    }); 

$('#sortable5').sortable({ 
     connectWith: '#sortable4', 
     items: ':not(.disabled)' 
    });