我有一个淘汰可排序列表,里面有淘汰可排序列表。基本上它是基本的“可用学生”示例(http://jsfiddle.net/rniemeyer/UdXr4/),只是我希望表格也可以排序。
我主要使用它,但是我有一个问题就是能够将表拖到其他表中。
我能够在表格列表中添加一个allowDrop函数,以防止学生被放入表格列表中,
this.isTable = function(arg) {
return arg.sourceParent != undefined;
};
所以我希望在学生名单上有类似的东西,不允许有桌子,但对于我的生活,我无法理解。我试过看id,甚至看看性别属性是否可用(因为它只应该在学生身上)无济于事......
我编辑了一个jsfiddle,使它更像我的情况;你会看到你拖动一张桌子,你可以把它放到另一张桌子里。 http://jsfiddle.net/nYSLq/1/
非常感谢任何帮助或建议。
答案 0 :(得分:5)
对于这类事情,一个不错的选择是使用connectClass
选项。这将有助于对可以放入项目的容器类型进行分类。
所以,你可以这样做:
<div id="main" data-bind="sortable: { data: tables, connectClass: 'tables' }">
<div class="table">
<div data-bind="text: students.id"></div>
<div class="seats" data-bind="sortable: { data: students, allowDrop: $root.isTableFull, connectClass: 'students' }">
<div class="student" data-bind="text: name"></div>
</div>
</div>
</div>
请注意,该插件会将该类分配给适合您的元素。
现在,学生只会与学生一起排序,桌子只能排在一起。
这是一个更新的小提琴,其中包含一些不必要的额外内容:http://jsfiddle.net/rniemeyer/7yA2s/