jQueryUI可排序列表与Knockout结合使用-嵌套可排序列表 [英] jQueryUI sortable list in combination with Knockout - nested sortable lists

问题描述

我是Knockout的新手(几天)，我正尝试对包含嵌套可排序列表的页面进行重做以使用它.

I am new to Knockout (a couple of days) and am attempting to rework a page that has nested sortable lists to use it.

我在这里找到了将可排序列表与Knockout结合使用的好方法:

I found a great answer to using sortable lists with Knockout here: Knockout custom binding for jQuery UI Sortable - strange behavior

但是，我无法使其与嵌套的可排序列表一起使用.尝试单击并拖动根目录列表下方的任何项目都具有拖动关联的根目录项目的效果.换句话说，嵌套列表根本不起作用.

However, I can't get it to work with nested sortable lists. Attempting to click and drag any item below the root list has the effect of dragging the associated root item. In other words, the nested lists don't work at all.

上述解决方案中的第二个选项是我所使用的.对我来说，这似乎是最简单，最清晰的.是否有一种相对简单的方法将其应用于嵌套的可排序对象?

The second option in the aforementioned solution is what I went with. It seemed the simplest and clearest to me. Is there a relatively easy way to apply it to nested sortables?

推荐答案

我的建议是使用我在此处创建的可排序插件: https://github.com/rniemeyer/knockout-sortable

My suggestion would be to use the sortable plugin that I created here: https://github.com/rniemeyer/knockout-sortable

它支持嵌套的可排序对象.使用最简单的配置，它看起来像:

It supports nested sortables. With the simplest configuration, it would look like:

<ul data-bind="sortable: children">
    <li>
        <div data-bind="text: name"></div>
        <ul data-bind="sortable: subs">
            <li data-bind="text: name"></li>
        </ul>
    </li>
</ul>

以下是示例: http://jsfiddle.net/rniemeyer/EMu95/

如果您的嵌套结构仍存在特定问题，那么也许您可以拨弄小提琴来演示您的问题.

If you are still having a specific issue with your nested structures, then maybe you can fork the fiddle to demonstrate your issue.

这篇关于jQueryUI可排序列表与Knockout结合使用-嵌套可排序列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！