jQueryのソート可能、クラス

Question

でソート複数のアイテムIは、次のようにソート可能で、リスト項目のセットを、持っている...

<ul id="item_list" class="ui-sortable"> 
    <li id="recordsArray_1">item</li>  
    <li id="recordsArray_2" class='1'>item</li> 
    <li id="recordsArray_3" class='1'>item</li> 
    <li id="recordsArray_4" class='1'>item</li> 
    <li id="recordsArray_5">item</li>  
    <li id="recordsArray_6" class='5'>item</li> 
    <li id="recordsArray_7" class='5'>item</li> 
    <li id="recordsArray_8" class='5'>item</li> 
    </ul> 

次のようにソートが順番にすべてを保つためにDBに更新され、 。

$(document).ready(function(){ 
    $(function() { 
    $("#item_list").sortable({ opacity: 0.6, cursor: 'move', update: function() { 
    var order = $(this).sortable("serialize") + '&action=updateRecordsListings'; 
    $.post("http://"+document.domain+"/includes/updateDB.php", order,function(theResponse){ 
    setClass() 
     }); 
     } 
     }); 
     }); 

     }); 

ヘッダー項目にはクラスが含まれず、子要素にはヘッダーのクラスが含まれます。ソート可能なのはヘッダーをソートすることが可能で、それはクラスに基づいた要素ですか？つまり、ヘッダーをドラッグするとすべての子要素がドラッグされますが、子要素は個別にドラッグされます。

Answer 1

あなたはプラグインオプション

$("#item_list").sortable({ opacity: 0.6, items: '.1, .5', cursor: 'move', update: function() 

でitems: '.1, .5'を追加することができますが、これは文句を言わない（1と2の間recordsArray_8）最初の「グループ」に最後の要素をドラッグ＆ドロップするようにユーザーを防ぐ

あなたは厳密にしたい場合は、「何のクラスは、」あなたはアイテムのための機能を使用することはできません。

$("#item_list").sortable({ opacity: 0.6, items: selectSortItems("#item_list"), cursor: 'move', update: function()... 

function selectSortItems (sel) { 
    var list = []; 
    $(sel).find('li').each(function() { 
     if ($(this).attr('class')) { list.push(this) }; 
    }); 

    return list; 
} 

（sadely項目は、コールバックを持っていないようです）。ここ

とは、あなたが接続している2つの異なるULのを行い、その後、それらをソート可能にする必要があります