javascript - 相互依存するDojoウィジェット/値を同期します

Question

ユーザーがいくつかのスライダーを調整するか、入力フィールドの値を編集して、提供されたデータに基づいて最終的な値を計算する、単純な「住宅ローン計算機」を作成しようとしています。

概略的には、次のようになります。

Slider1 - Input1
Slider2a - Input2a
Slider2b - Input2b

入力の値をスライダーに反映する必要があり、その逆も同様です。さらに、スライダー2a/2bと入力2a/2bの値と制限は、いくつかの簡単な規則に従って、互いに依存しています。

これは私が今まで使ったことのない道場で行わなければならず、道場にはかなり良いドキュメントがありますが、それは少し圧倒されるので、誰かが私を正しい方向に向けてくれれば幸いです。

score 3 · Accepted Answer

まず、jsFiddleで動作する私のソリューションは次のとおりです。http：//jsfiddle.net/phusick/HCx3w/

を使用してdojo/aspect、さまざまな方法でこれらのウィジェットを相互に直接接続できます。おそらく、密に結合されたウィジェットのセットになります。つまり、特定のウィジェットがその値が別のウィジェットと同期されているという事実についての知識を持っている必要がある理由がない場合でも、それらのウィジェットは互いに認識します。dojo/topicdojo/Stateful

前述とは異なり、loose coupling原則を適用できます。これにより、ウィジェット間の相互参照なしに、任意の数のウィジェットを同期できます。これが私の解決策です：

ウィジェットへの参照を取得し、それらをセットに結合します（arrays）：

var slider1 = registry.byId("slider1");
var slider2 = registry.byId("slider2");
var spinner1 = registry.byId("spinner1");
var spinner2 = registry.byId("spinner2");

var set1 = [slider1, spinner1];
var set2 = [slider2, spinner2];

synchronize働き：

var synchronize = function(/*Array*/ widgets, /*String*/ topicName) {

    var synchronized = function() {
        var count = 0;
        array.forEach(widgets, function(widget) {
            if(widget.get("synchronized") === true) { count++} 
        });
        return (count == widgets.length);
    }

    array.forEach(widgets, function(w) {

        w.set("synchronized", false);

        // register onchange handler for each widget in the set
        w.on("change", function(value) {
            array.forEach(widgets, function(widget) {
                if(this !== widget) {
                    widget.set("value", value);
                    widget.set("synchronized", true);
                }                                         
            }, this);

            // needed to publish topic just once per value change across all the widgets in the set
            if(synchronized()) {
                array.forEach(widgets, function(widget) {
                    widget.set("synchronized", false);
                });
                // publish topic if any
                if(topicName) { topic.publish(topicName, value)};
            }
        });
    });
}

sychronize関数を介して同期するウィジェットのセットを登録します。

synchronize(set1, "value1-changed");   // synchronize and publish topic when value changes
synchronize(set2);                     // just synchronize

上記で登録したものを購読しtopicます。

topic.subscribe("value1-changed", function(value) {
    console.log("value1-changed", value);
    // here you can change value and limits of of `set2` widgets
});

score 0 · Accepted Answer

dojo.connectを試しましたか。これは、メソッドチェーンを使用できます。したがって、イベントがコントロールで発生すると、複数のメソッドを呼び出すことができます。これに加えて、dojoにはpublish/subscribeメカニズムがあります。pub \ sumモデルでは、単純なメッセージ文字列をサブスクライブするメソッドを記述できます。あるメソッドがその文字列を公開すると、サブスクライバーメソッドよりも呼び出されます。

score 0 · Accepted Answer

道場。ステートフルはあなたの友達です... http：//dojotoolkit.org/reference-guide/1.7/dojo/Stateful.html

javascript - 相互依存するDojoウィジェット/値を同期します

3 に答える 3

Related

Reference