jquery ui sortableを備えたknockoutjs

StackOverflow https://stackoverflow.com/questions/4146751

  •  30-09-2019
  •  | 
  •  

質問

私はこれを支援するためにノックアウトのフォーラムでGoogleグループと協力していますが、私はより多くの視聴者が状況を傷つけることは決してないと考えています。

jquery UIの「ソート可能な」プラグインを使用して、KOに状況で作業させようとしています。ここにコードを投稿しています。

http://www.pastie.org/1285716

カスタムバインディングを使用しようとしています... 

        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();
            }
        };

目標は、ソート可能なリストがアイテムを受け取ると、アイテムを取得して他の観察結果に追加できることです。

しかし、これは私にとって完全に機能していません。私はそれが欲しいようにイベントを解雇するのが難しいです。私がそれをセットアップする方法、それは発射しますが、それは「真/偽」値を返すだけです。私は他の誰かが私が間違っていることを考えて、それを修正する方法を知っていることを望んでいました。

（コードを使用するには、参照する必要があります 

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

上部で、そしてノックアウトの最新バージョン（1.1.1）

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

役に立ちましたか？

解決

気づかなかった スティーブはすでにこれに答えていました 終わる前に。ここに行きますが、彼とは少し異なります。

ソート可能な場合、これははるかに難しくなります。これは、各製品にバインディングされたドラッグアンドドロップバインディングではるかに簡単でした。 Surtableの問題は、アイテムの代わりにリスト全体を拘束していることです。

http://www.pastie.org/1432093

他のヒント

サンプルを作り直し、ほぼ完全なバインディングハンドラーを搭載しましたが、ID属性は必要ありません。また、並べ替えも処理します。これがコードです：

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

利用方法：

  • Template.Foreach Bindingを使用して、ViewModelの関連配列が何であるかを確認しています。

  • databind = "foreach：foreach、sortable：true"を使用して、オプションのない単一の配列内でソートを有効にすることができます。

  • Observablearrayオブジェクトを使用しています。

  • jqueryを単独で構築しています。jquery.sortableコンストラクターよりも、バインディングで同じオプションオブジェクトをバインディングに渡すことができます。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top