2014-01-26 43 views
0

這之間拖動列表項的設置:jQuery UI的排序:一組兩列之間,不同羣體

<div id='sortable_groups'> 
<div id='group1'> 
    <div id='g1_col1' class='sort_column'> 
    </div> 
    <div id='g1_col2' class='sort_column'> 
    </div> 
</div> 
<div id='group2'> 
    <div id='g2_col1' class='sort_column'> 
    </div> 
    <div id='g2_col2' class='sort_column'> 
    </div> 
</div> 

所以我已經有工作在那裏的羣體本身可以拖動來回並且我的頁面啓動時打印到列中的任何項目都可以在同一組的第1列或第2列中進行排序。下面是該jQuery的:

$("#sortable_groups").sortable({ 
}).disableSelection();   
$("#g1_col1,#g1_col2,#g2_col1,#g2_col2").sortable({ 
connectWith: ".sort_column", 
tolerance: "pointer", 
update: function(){ 
}, 
}).disableSelection(); 

所以我希望能夠從任何列拖動一個項目到任何其他列。但是,例如,當我從g2_col1拖放時,它只會放入g2_col1或g2_col2中,而不是group1中的任何內容。我已經嘗試使group1列的最小高度足夠大,以至於有可投放區域。我也試着將一個函數綁定到可排序的「start」屬性,這樣當拖動某些東西時,它會在目標列中爲我拖動的目標列創建一個虛擬div。

但似乎沒有工作。無論我嘗試什麼,可排序的項目都想留在組中。如果有辦法讓項目在兩列之間均勻分佈,我特別喜歡它。例如,如果有一種方法可以鎖定排序,以便只能交換項目並且不能爲任何新項目騰出空間。

這樣我就可以在開始時製作虛擬位置,只允許拖動的物品落在現有物品或新創建的虛擬物品上。

如此完美的情況之外,我會滿足於能夠組:(之間拖動

回答

3

好,修修補補使得魔術我想,我才知道,我的代碼工作原樣,但我有一個錯誤我JS腳本,使我的列可排序字符串只有g2_col1和g2_col2在其中,而不是第一列。去計算它不會在不在字符串中的列,嗯?

對於任何其他人一個類似的問題,請記住,空列區域必須有高度,否則drop將沒有任何連接。同時改變爲容差:pointer help。請參閱文檔以獲取有關如何附加多個可排序列和行的說明對方在這裏:......呃......沒關係。我無法找到顯示上述語法的文檔,將多個ID作爲可排序連接在一起,但上面的語法是正確的。