0

現在、ノックアウトの別のバインディング イベントの結果に依存するバインディング イベントを発生させることができません。

以下の例では、'available' 入力に値を指定します。'condition1' 入力に 22 などの値が入力されている場合、'available' 入力をクリアして無効にする必要があります。これはすべて、スキップ ロジック バインディングで行われます。 . これは適切に行われています。

ただし、問題は chain1 入力要素での skiplogic バインディングの実行にあります。これは、「使用可能な」入力の値がクリアされた後でも発生しません。あるバインディングの結果が別のバインディングを起動するようにするにはどうすればよいですか?

これは、以下のコードの js フィドル バージョンです: http://jsfiddle.net/gYNb8/2/

コンセプトをテストするために私が使用しているフォームは次のとおりです。

<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<span>Condition 1</span> 
<input id="condition1" data-bind="value: condition1" />
<br/>
<span>Condition 2</span> 
<input id="condition2" data-bind="value: condition2" />
<br/>
<span>Available?</span> 
<input id="available" data-bind="value: available, skipLogic: condition1, skipLogic: condition2" />
<br/>
<span>Chain1</span> 
<input id="chain1" data-bind="value: chain1, skiplogic: available" />

これがJavaScriptです：

// この画面の全体的なビューモデルと初期状態 function ReservationsViewModel() { var self = this;

    self.condition1 = ko.observable();
    self.condition2 = ko.observable();
    self.available = ko.observable();
    self.chain1 = ko.observable();

}

//Here are the conditions which govern whether an element should be enabled or not
var elementConditions = {
    'available': [{
        'Condition': 'condition1() > 0',
        'Type': 'evaluation'
    }, {
        'Condition': 'condition2() > 0',
        'Type': 'evaluation'
    }],
        'chain1': [{
        'Condition': 'available',
        'Type': 'empty'
    }]
};


ko.bindingHandlers.skipLogic = {
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) {


        var id = $(element).attr("id");
        var conditions = elementConditions[id];
        var isSkipped = false;
        var conditionMet = false;

        for (var i = 0; i < conditions.length; i++) {
            conditionMet = false;
            if (conditions[i].Type == "evaluation") {
                conditionMet = eval('viewModel.' + conditions[i].Condition);
            } else if (conditions[i].Type == "empty") {
                if ($('#' + conditions[i].Condition).val().length == 0) {
                    conditionMet = true;
                }
            } else if (conditions[i].Type == "notempty") {
                if ($('#' + conditions[i].Condition).val().length > 0) {
                    conditionMet = true;
                }
            }

            if (conditionMet == true) {
                isSkipped = true;
            }
        }

        if (isSkipped) {
            eval("viewModel." + id + "('');");            
            $(element).attr("disabled", "disabled");
        } else {
            if (elementSkipped[id] > 0) {
                $(element).attr("disabled", "disabled");
            } else {
                $(element).removeAttr("disabled");
            }
        }
    }
};

ko.applyBindings(new ReservationsViewModel());
4

2 に答える 2