knockout.js - example - jQueryUI lista ordenable en combinación con Knockout-listas ordenables anidadas

knockoutjs event binding

Question

Soy nuevo en Knockout (un par de días) y estoy tratando de volver a trabajar una página que tiene anidadas listas ordenables para usarlo.

Encontré una excelente respuesta al uso de listas ordenables con Knockout aquí: enlace personalizado knockout para jQuery UI ordenable - comportamiento extraño

Sin embargo, no puedo hacer que funcione con listas ordenables anidadas. Intentar hacer clic y arrastrar cualquier elemento debajo de la lista raíz tiene el efecto de arrastrar el elemento raíz asociado. En otras palabras, las listas anidadas no funcionan en absoluto.

La segunda opción en la solución antes mencionada es a lo que recurrí. Parecía el más simple y claro para mí. ¿Hay una manera relativamente fácil de aplicarlo a los ordenamientos anidados?

Answer 1

Mi sugerencia sería usar el complemento ordenable que he creado aquí: https://github.com/rniemeyer/knockout-sortable

Es compatible con ordenables anidados. Con la configuración más simple, se vería así:

<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>

Aquí hay una muestra: http://jsfiddle.net/rniemeyer/EMu95/

Si todavía tiene un problema específico con sus estructuras anidadas, entonces tal vez pueda bifurcar el violín para demostrar su problema.