4

KnockoutJSとjQueryUISortableを一緒に使用しようとしています。私はこれが以前に行われたことを知っています（特に、ノックアウトソート可能）が、私のユースケースにはかなり特定の動作があり、切り替えを試みないようにしたいと思っています。

とにかく、問題は非常に単純です-jQuery UI Sortableを使用してDOM要素を移動した後、そのDOM要素にバインドされたobservableArray要素を削除すると、Knockoutは奇妙な動作をします。移動された要素の削除に失敗し、移動された要素の場所に落ちた要素が削除されると、それと最初に移動された要素の両方が削除されます。言葉で表現するのは難しいですが、このフィドルによって示されています。

この問題は、実際にはknockout-2.1.0.jsの次のブロックで発生しているようです。

function fixUpVirtualElements(contiguousNodeArray) {
    // Ensures that contiguousNodeArray really *is* an array of contiguous siblings, even if some of the interior
    // ones have changed since your array was first built (e.g., because your array contains virtual elements, and
    // their virtual children changed when binding was applied to them).
    // This is needed so that we can reliably remove or update the nodes corresponding to a given array item

    if (contiguousNodeArray.length > 2) {
        // Build up the actual new contiguous node set
        var current = contiguousNodeArray[0], last = contiguousNodeArray[contiguousNodeArray.length - 1], newContiguousSet = [current];
        while (current !== last) {
            current = current.nextSibling;
            if (!current) // Won't happen, except if the developer has manually removed some DOM elements (then we're in an undefined scenario)
                return;
            newContiguousSet.push(current);
        }

        // ... then mutate the input array to match this.
        // (The following line replaces the contents of contiguousNodeArray with newContiguousSet)
        Array.prototype.splice.apply(contiguousNodeArray, [0, contiguousNodeArray.length].concat(newContiguousSet));
    }
}

この呼び出しは、移動されたDOM要素を、シフトされた要素が削除されたときに削除される要素のリストに追加します。

したがって、jQuery UI / Knockoutjsの天才へのオープンコール-この競合を解決する方法はありますか、それともこれらのツールをうまく連携させるためにまったく異なることをする必要がありますか？

4

1 に答える 1

3

「最善の」解決策は、DOM から要素を削除し、KO での位置を変更することだと思います。stopソート可能なイベントでこれを行うことができます。http://jsfiddle.net/vgrTY/4/

先に進み、array-contentsテキストも計算済みに変更して、正しく表示されるようにしました。

于 2012-08-22T22:35:02.720 に答える