登錄表仍然張貼，即使所需的輸入爲空

Question

我在新的MVC4解決方案中使用jquery不顯眼的驗證。我的問題是，在我的登錄頁面上，當我點擊提交按鈕時，即使我的必填字段爲空，頁面仍然會被髮布。

我有另一個頁面，我有相同的設置，一個不發佈。

這是我的登錄頁面：

<div id="loginForm"> 

    @Html.SiteLogo() 
    @using (Html.BeginForm(new { ReturnUrl = ViewBag.ReturnUrl })) { 
     @Html.AntiForgeryToken() 
     @Html.ValidationSummary(true) 

     <div id="loginForm-container" class="spacer-below">    
      <fieldset> 
       <legend>Log in Form</legend> 
       <div class="input-control text" data-role="input-control">      
        @Html.TextBoxFor(m => m.UserName, new { placeholder="Please enter your username"}) 
        @Html.ValidationMessageFor(m => m.UserName) 
       </div>      

       <div class="input-control password" data-role="input-control">           
        @Html.PasswordFor(m => m.Password, new { placeholder="Please enter your password"}) 
        @Html.ValidationMessageFor(m => m.Password) 
       </div> 

       <div class="input-control checkbox" data-role="input-control"> 
        <label> 
         @Html.CheckBoxFor(m => m.RememberMe) 
         <span class="check"></span>&nbsp;Remember me 
        </label> 
       </div> 

       <div class="input-control">  
        <input type="submit" class="primary small" value="Log in" /> 
       </div> 
      </fieldset>     
     </div> 

     <div class="forgotPassword">@Html.ActionLink("Forgotten password?", "ForgotPassword")</div> 
     <span>@Html.Partial("_CustomerSupport")</span> 
    } 
</div> 

而且這個頁面的視圖模型：

public class LoginModel 
{ 
    [Required] 
    [Display(Name = "User name")] 
    public string UserName { get; set; } 

    [Required] 
    [DataType(DataType.Password)] 
    [Display(Name = "Password")] 
    public string Password { get; set; } 

    [Display(Name = "Remember me")] 
    public bool RememberMe { get; set; } 
} 

這的HTML，做工作，即不發佈頁面，如果輸入的是空的

<div id="resetPasswordForm"> 

    @Html.SiteLogo() 
    <h4>Reset Password</h4> 
    @using (Html.BeginForm(new {ReturnUrl = ViewBag.ReturnUrl})) 
    { 
     @Html.AntiForgeryToken() 
     @Html.ValidationSummary(true) 

     @Html.HiddenFor(vm => vm.Authentication.Token)     
     @Html.ValidationMessageFor(vm => vm.Authentication.Token) 

     <div id="resetPasswordForm-container" class="spacer-below">    
      <fieldset> 
       <legend>Reset password form</legend> 
       <div class="input-control text" data-role="input-control">      
        @Html.TextBoxFor(vm => vm.Authentication.EmailAddress, new { placeholder="Please enter your email address"})       
        @Html.ValidationMessageFor(vm => vm.Authentication.EmailAddress) 
       </div>      
       <div class="input-control password" data-role="input-control">      
        @Html.PasswordFor(vm => vm.NewPassword, new { placeholder="Please enter a new password"})       
        @Html.ValidationMessageFor(vm => vm.NewPassword) 
       </div>      
       <div class="input-control text" data-role="input-control">      
        @Html.PasswordFor(vm => vm.ConfirmPassword, new { placeholder="Please enter the password again"})       
        @Html.ValidationMessageFor(vm => vm.ConfirmPassword) 
       </div>          
       <div class="input-control">  
        <input type="submit" class="primary medium" value="Reset Password" /> 
       </div> 
      </fieldset>     
     </div> 
     <span>@Html.Partial("_CustomerSupport")</span> 
    } 
</div> 

而且我爲這個頁面視圖模型：

public class ResetPasswordViewModel 
{ 
    public ResetPasswordViewModel() 
    { 
     Authentication = new ResetPasswordConfirmViewModel(); 
    } 

    public ResetPasswordConfirmViewModel Authentication { get; set; } 

    [Required] 
    [StringLength(100, ErrorMessage = "The {0} must be at least {2} characters long.", MinimumLength = 6)] 
    [DataType(DataType.Password)] 
    [Display(Name = "New password")] 
    public string NewPassword { get; set; } 

    [DataType(DataType.Password)] 
    [Display(Name = "Confirm new password")] 
    [Compare("NewPassword", ErrorMessage = "The new passwords do not match, please enter again.")] 
    public string ConfirmPassword { get; set; } 
} 

我的觀點的引用，當我查看源爲選中相應的腳本：

<script src="/Scripts/jquery.validate.js"></script> 
<script src="/Scripts/jquery.validate.unobtrusive.js"></script> 

我還要提到的是，我從下面的指南：

http://nickstips.wordpress.com/2011/08/18/asp-net-mvc-displaying-client-and-server-side-validation-using-qtip-tooltips/

在爲了嘗試像驗證一樣得到懸停。除了登錄表單之外，此功能完美無缺。經過進一步調查，似乎代碼在onError（）方法更改中出錯，因爲可能沒有對此字段進行驗證（因爲它是可選的，所以我不需要對驗證記住我）。

var replace = $.parseJSON(container.attr("data-valmsg-replace")) !== false; 

我猜是不需要驗證我輸入它不具備數據valmsg替換屬性，因此該行造成的JavaScript失敗等職經歷？

Answer 1

該問題似乎是因爲記住我複選框未應用任何驗證屬性。當代碼鑽進的onError（）方法將其未能在這條線：

var replace = $.parseJSON(container.attr("data-valmsg-replace")) !== false; 

如container.attr（「數據valmsg替換」）是一個空字符串。

我換成這個代碼：

var elementJson = container.attr("data-valmsg-replace") || 'false'; 
var replace = $.parseJSON(elementJson) !== false; 

，這一切似乎是現在的工作確定。我不確定這是否是編寫JavaScript的最佳方式，但似乎有訣竅。

在問題中提到的原代碼是從：

MVC clientside and serverside using qTip

Answer 2

確保您的視圖引用的腳本：

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 

這聽起來很明顯，但在創建視圖對話框中的某些選項，即使你有Reference script libraries檢查，它實際上不會添加腳本到了這個觀點，所以值得仔細檢查。

編輯

只注意到你正在使用MVC 4，在這種情況下，這可能是你在你的視圖的底部缺什麼：

@section Scripts { 
    @Scripts.Render("~/bundles/jqueryval") 
} 

我居然能重現驗證問題，如果腳本未捆綁，則不會觸發。