0

テキスト フィールドにデータ属性 (data-invalid) が無効な場合は追加し、有効な場合は削除します。html と js は次のとおりです。

<form data-bind="submit: submitFields">
   First Name: <input type="text" runat="server" ID="FirstName" data-bind="value: firstName, valueUpdate: 'blur', attr: { 'data-invalid': !firstName.isValid()}"/>
   <br/>
   <button type="submit" >Submit</button>
</form>

var viewModel;

viewModel = function() {
    self = this;
    self.firstName = ko.observable().extend({
        required: true,
        notify: 'always'
    });

    //sets errors to an array of the error messages?
    self.errors = ko.validation.group(this, { deep: true, observable: false })

    self.submitFields = function(formElement) {
        if (self.errors().length > 0) {
           self.errors.showAllMessages();
           return;
        }
        //submit
    }
};

ko.applyBindings(new viewModel());

そして、それをテストするためのフィドル: http://jsfiddle.net/frontenderman/HhtEZ ​​/2/

私の問題は、 firstName.IsValid() がページロードで実行されることです。これを回避するエレガントな方法はありますか?私が考えることができるのは、firstName をサブスクライブし、ビュー モデルの最初の実行時にフラグを使用して data-attribute を null に設定し、その後の実行で !firstName.isValid() を返すようなことです。

4

0 に答える 0