jquery - Knockoutjs 与 jQuery UI 可排序

Question

我也在 Knockout 论坛上与 Google 网上论坛合作寻求帮助，但我认为更多的受众永远不会损害这种情况。

我正在尝试让 KO 处理使用 jQuery UI 的“Sortable”插件的情况。我在这里发布了我的代码。

http://www.pastie.org/1285716

尝试使用自定义绑定(bind)...

        ko.bindingHandlers.onReceiveItem = {
            init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
                $(element).bind("sortreceive", function (event, ui) {
                    ko.bindingHandlers.onReceiveItem.update(element, valueAccessor, allBindingsAccessor, viewModel);
                });
            },
            update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
                var value = ko.utils.unwrapObservable(valueAccessor());
                var bindings = allBindingsAccessor();
            }
        };

目标是当Sortable List收到一个项目时，它可以获取该项目并将其添加到另一个observableArray中。

不过，这对我来说不太有效。我很难让事件按照我想要的方式进行。按照我设置的方式，它确实会触发，但它只返回“真/假”值。我希望其他人可能知道我做错了什么并知道如何解决它。

(使用代码，需要引用

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery-ui.css" rel="Stylesheet" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.js"></script>

在顶部，然后是最新版本的 Knockout (1.1.1)

http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-1.1.1.debug.js

Answer 1

我重新设计了示例，并提供了一个几乎完整的绑定(bind)处理程序，它不需要 id 属性，并且还可以处理重新排序。代码如下:

http://jsbin.com/knockoutsortable/20/edit

用法:

• 它使用 template.foreach 绑定(bind)来查找 viewModel 中关联的数组。

• 您可以使用 databind="foreach: Products, sortable: true"在单个数组内启用排序，无需任何选项。

• 它正在处理 observableArray 对象。

• 它自行构建 jQuery 可排序，您可以在绑定(bind)中传递与 jQuery.sortable 构造函数中相同的选项对象。