0

私はノックアウト検証を使用しています。これが私のモデルの外観です

function SignInViewModel() {

    var self = this;
    self.userName = ko.observable('').extend({
        required: true,
        pattern: {
            message: 'Username must be a valid email address',
            params: /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/
        }
    });
    self.password = ko.observable('').extend({
        required: true
    });

    self.errors = ko.validation.group(self);
    self.login = function (e) {

        if (self.errors().length == 0) {

            $.post("/account/jsonlogin", { userName: self.userName(), password: self.password(), returnUrl: "/" })
                .done(function (result) {
                    redirect(result.redirect);
                }).error(function () {

                });
        } else {

            self.errors.showAllMessages();
        }
    }

}
ko.validation.configure({
    insertMessages: true,
    decorateElement: true,
    errorElementClass: 'error'
});
$(function () {
    ko.applyBindings(new SignInViewModel());
});

無効な電子メール アドレスをuserName入力し、送信ボタンをクリックしてログインを呼び出すと、ノックアウトは要素のすぐ隣にエラー メッセージ スパンを追加しますが、何も表示しないように設定されています。何が問題ですか。

ありがとう

4

3 に答える 3

0

ブートストラップにはクラスがあるため、問題はブートストラップが原因でした

.input-append, .input-prepend {
   margin-bottom: 5px;
   font-size: 0;
    white-space: nowrap;
 }

これfont-size:0は問題を引き起こしていました。ノックアウトは期待どおりに機能していました。

于 2013-06-27T05:25:39.503 に答える
0

このフィドルで問題を再現できますか:

http://jsfiddle.net/jearles/hRa2h/

--

これは私にとってはうまくいきます。すぐにエラー カウント 2 が表示され、[ログイン] を押すとエラーが表示されます。無効な電子メールを入力すると、電子メール メッセージが表示されます。

====

HTML

<fieldset>
    <legend>User: <span data-bind='text: errors().length'></span> errors</legend>
    <label>User name: <input data-bind='value: userName'/></label><br/>
    <label>Password: <input data-bind='value: password' type="password"/></label>

</fieldset>
<button type="button" data-bind='click: login'>Login</button>

JS

ko.validation.configure({
    insertMessages: true,
    decorateElement: true,
    errorElementClass: 'error',
    messagesOnModified: false    
});

function SignInViewModel() {

    var self = this;
    self.userName = ko.observable().extend({
        required: true,
        pattern: {
            message: 'Username must be a valid email address',
            params: /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/
        }
    });
    self.password = ko.observable().extend({
        required: true
    });

    self.errors = ko.validation.group(self);
    self.login = function (e) {

        if (self.errors().length == 0) {
            alert('No errors');
        } else {

            self.errors.showAllMessages(true);
        }
    }

}
$(function () {
    ko.applyBindings(new SignInViewModel());
});
于 2013-06-26T10:39:08.367 に答える
0

''コードから を削除します

self.userName = ko.observable('').extend({

あなたのコードで

上記の行は次のようになります。

self.userName = ko.observable().extend({

エラー メッセージは span タグに表示されます。

于 2015-02-19T17:28:34.007 に答える