2014-07-07 42 views
0

我正在使用簡單的登錄頁面來捕獲登錄名和密碼。當用戶點擊忘記密碼按鈕時,我只驗證登錄文本框。KO驗證組錯誤

它在初始頁面加載中運行良好。最初,如果我保持用戶ID爲空,並單擊忘記密碼觸發驗證錯誤,如果我改正,仍然我在錯誤對象中獲得空值。我不確定這個空值是從哪裏來的。

我的代碼遵循

的Javascript

var loginModule = (function() { 
$(document).ready(function() { 

    var userName = $('input:text[name=username]').val(); 
    var password = $('input:text[name=password]').val(); 

    ko.validation.registerExtenders(); 
    ko.validation.init(); 
    ko.applyBindings(new viewmodel(userName, password)); 

}); 



var viewmodel = function (username, password) { 

    var self = this; 

    self.UserName = ko.observable(username).extend({ required: { message: 'User Id is required.' }, minLength: 5, maxLength: 10 }); 

    self.Password = ko.observable(password).extend({ required: { message: 'Password is required.' }, minLength: 5, maxLength: 10 }); 

    self.forgotPassword = function() { 

     var fperrors = ko.validation.group(self.UserName, { deep: false}); 

     if (fperrors().length > 0) { 

      $('#errorMsg').show(); 

      fperrors.showAllMessages(); 

     } 

     else { 

      //valid code 

     } 

    }; 
}; 

return { 
    viewmodel: viewmodel 

} 

})(); 

如果我改變 VAR fperrors = ko.validation.group(self.UserName,{深:假});

到 var fperrors = ko.validation.group(self.UserName(),{deep:false});

它沒有拋出驗證錯誤。

HTML標記

<P> 

<p> 

<span class="error" data-bind='visible: UserName.hasError, text: UserName.validationMessage'></span> 

</p> 

<LABEL class="field-label" for="User-id">User ID/alias<EM class=mandatory>*</EM></LABEL><input id="User-id" name="username" class=field-stretch data-bind='value:UserName, valueUpdate: "afterkeydown"' 

         type="text" value="" /></P> 

<P> 

<p><span class="error" data-bind='visible: Password.hasError, text: Password.validationMessage'></span></p> 

<LABEL class=field-label for=Password>Password<EM class=mandatory>*</EM></LABEL> <input id="Password" name="password" class=field-stretch data-bind='value:Password, valueUpdate: "afterkeydown"' type="password" value="" /></P> 

<P class="text-left btn-wrap"><INPUT class="btn-primary" data-bind='click:submit' value="Logon" type=submit> &nbsp; <INPUT data-bind='click:forgotPassword' class=btn-primary value="Forgotten password?" type=submit> </P> 

一些可以幫助一個什麼錯呢?

+2

你能告訴你的HTML? –

回答

1

我不知道爲什麼,但在我的測試,我不得不通過觀察爲數組得到它的工作:

var fperrors = ko.validation.group([self.UserName], { deep: false}); 

http://jsfiddle.net/LHy6h/

+0

謝謝,它工作正常。不知道爲什麼我需要將observable作爲數組傳遞。 – Bumble