【问题标题】:How to prevent knockout nested sortable from allowing drop in sub list?如何防止淘汰嵌套可排序允许放入子列表?
【发布时间】:2012-11-26 03:46:33
【问题描述】:

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

我大部分时间都在工作,但是我无法将表格拖到其他表格中。

我能够在表格列表上添加一个allowDrop函数,以防止学生被丢弃到表格列表中,

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

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

我编辑了一个 jsfiddle 使其更类似于我的情况;你会看到如果你拖动一个表,你可以把它放到另一个表中。 http://jsfiddle.net/nYSLq/1/

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

【问题讨论】:

    标签: javascript knockout.js knockout-sortable


    【解决方案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/

    【讨论】:

    • 非常感谢,这正是我所需要的,而且清理工作也很好。我尝试了connectedClass,但猜想我对如何使用它感到困惑并且无法让它工作。再次感谢您的快速回复。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-07-03
    • 2016-04-26
    • 2018-01-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-08-29
    相关资源
    最近更新 更多