Knockout-Sortable：从排序列表中排除项目答案

【问题标题】：Knockout-Sortable: Exclude item from sort listKnockout-Sortable：从排序列表中排除项目
【发布时间】：2014-01-15 08:45:18
【问题描述】：

我正在使用可淘汰排序对集合进行排序，并且我有一个“新”行，该行应始终保持为空并位于列表的底部。我可以通过在 beforeMove 中检查位置来取消该行“之后”的放置，但如果我可以首先防止该行下方的区域显示为可放置目标，那就更好了。

这可能吗？行本身是我正在排序的集合中的一个真实元素，是在我与sortable绑定的容器中：，这些事情很难改变。

<div id="main">
    <h3>Tasks</h3>
    <div class="container" data-bind="sortable: tasks">
        <div class="item">
            <span data-bind="visible: !$root.isTaskSelected($data)">
                <a href="#" data-bind="text: name, click: $root.selectedTask"></a>
            </span>
            <span data-bind="visibleAndSelect: $root.isTaskSelected($data)">
                <input data-bind="value: name, event: { blur: $root.clearTask }" />
            </span>  
        </div>
    </div>
    <a href="#" data-bind="click: addTask">Add Task</a>
</div>

basic sortable JSFiddle。我希望在“输入新任务”行下方是不可能的。

【问题讨论】：

当然可以……有代码示例吗？

标签： javascript knockout.js knockout-sortable

【解决方案1】：

您可以使用 jQuery UI 的 sortable 的 items option 来实现此目的。

这个想法是，您将一个类放在您真正希望可排序的项目上，然后使用items 选项来选择它们。

这个类可以来自一个计算的。在您的情况下计算可能与列表中的最后一项有关。

当你绑定时，它看起来像：sortable: { data: items, options: { items: '.good-items' } }

这是一个基本示例：http://jsfiddle.net/rniemeyer/mBjHN/

【讨论】：