如何防止淘汰嵌套可排序允许丢弃子列表？

Question

我有一个淘汰可排序的列表,里面有淘汰的可排序列表.基本上它是基本的"可用学生"示例(http://jsfiddle.net/rniemeyer/UdXr4/),只是我希望表格也可以排序.

我主要工作,但我有一个问题,能够将表拖动到其他表.

我能够在表格列表中添加一个allowDrop函数,以防止学生被放入表格列表,

        this.isTable = function(arg) {
            return arg.sourceParent != undefined;
        };

所以我希望在学生名单上有类似的东西,不允许有桌子,但对于我的生活,我无法理解.我试过看id,甚至看看性别属性是否可用(因为它应该只对学生来说)无济于事......

我编辑了一个jsfiddle,使它更像我的情况; 你会看到你拖动一张桌子,你可以把它放到另一张桌子里. http://jsfiddle.net/nYSLq/1/

任何帮助或建议将不胜感激.

Answer 1

对于这种类型的东西,一个很好的选择是使用该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/