2014-01-26 38 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作为可排序连接在一起,但上面的语法是正确的。