MVC 3驗證 - 僅在失去焦點或提交後才顯示錯誤消息？

Question

我已經使用DataAnnotations（必需，stringlength等）在我的MVC 3應用程序中設置了實體，MVC頁面正確顯示了驗證錯誤消息。但是，只要在用戶有機會輸入無效值之前頁面加載新窗體時就會顯示錯誤消息。

我幾年前曾經使用JQuery驗證，並且只能在用戶失去焦點或嘗試提交表單之後顯示錯誤消息。事實上，我認爲這是默認行爲。

有沒有辦法在MVC 3中使用DataAnnotations來做同樣的事情？

編輯：下面是HTML

<div class="form horizontal floated w50p"> 
<h3>Billing Information</h3> 
@using(Html.BeginForm()){ 
    <div class="item"> 
     <div class="label"> 
      <label>* First Name</label></div> 
     <div class="value">@Html.TextBoxFor(x => x.Name)</div> 
     <div class="value">@Html.ValidationMessageFor(x => x.Name)</div> 
    </div> 
    <div class="item"> 
     <div class="label"> 
      <label>* Address 1</label></div> 
     <div class="value">@Html.TextBoxFor(x => x.Street1)</div> 
     <div class="value">@Html.ValidationMessageFor(x => x.Street1)</div> 
    </div> 
    <div class="item"> 
     <div class="label"> 
      <label>Address 2</label></div> 
     <div class="value">@Html.TextBoxFor(x => x.Street2)</div> 
    </div> 
    <div class="item"> 
     <div class="label"> 
      <label>Address 3</label></div> 
     <div class="value">@Html.TextBoxFor(x => x.Street3)</div> 
    </div> 
    <div class="item"> 
     <div class="label"> 
      <label>City</label></div> 
     <div class="value">@Html.TextBoxFor(x => x.City)</div> 
     <div class="value">@Html.ValidationMessageFor(x => x.City)</div> 
    </div> 
    <div class="item"> 
     <div class="label"> 
      <label>State/Province/Region</label></div> 
     <div class="value">@Html.TextBoxFor(x => x.StateProv)</div> 
     <div class="value">@Html.ValidationMessageFor(x => x.StateProv)</div> 
    </div> 
    <div class="item"> 
     <div class="label"> 
      <label>Zip/Postal Code</label></div> 
     <div class="value">@Html.TextBoxFor(x => x.PostalCode)</div> 
     <div class="value">@Html.ValidationMessageFor(x => x.PostalCode)</div> 
    </div> 
    <div class="item"> 
     <div class="label"> 
      <label>* Contact Phone</label></div> 
     <div class="value">@Html.TextBoxFor(x => x.ContactPhone)</div> 
     <div class="value">@Html.ValidationMessageFor(x => x.ContactPhone)</div> 
    </div>  <input type="submit" value="Submit" /> 
} 

Answer 1

默認行爲與您所描述的完全相同（只有在字段丟失焦點或提交表單時纔會出現錯誤）。所以，你的視圖或控制器一定有問題。具體來說，聽起來好像驗證者認爲用戶即使在表單的第一個視圖中也會回傳。表單的第一個視圖應該是GET而不是POST。如果你粘貼你的控制器代碼，那可能會幫助我們更好地診斷它。

Answer 2

你是說讓客戶驗證？當然，這很容易。剛：

1. 創建一個視圖模型
2. 裝飾它
3. 創建控制器
4. 創建一個視圖
5. 包括正確的jQuery腳本

因此，讓我們繼續遵循這些步驟。

視圖模型：

public class ProductViewModel 
{ 
    [Required] // <-- you could use any data annotation attributes you like 
    public string Name { get; set; } 
} 

控制器：

public class HomeController : Controller 
{ 
    public ActionResult Index() 
    { 
     var model = new ProductViewModel(); 
     return View(model); 
    } 

    [HttpPost] 
    public ActionResult Index(ProductViewModel model) 
    { 
     return View(model); 
    } 
} 

查看：

@model ProductViewModel 

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

@using (Html.BeginForm()) 
{ 
    @Html.LabelFor(x => x.Name) 
    @Html.EditorFor(x => x.Name) 
    @Html.ValidationMessageFor(x => x.Name) 
    <input type="search" value="OK" /> 
} 

現在離開領域的空白和客戶端驗證將觸發假設它在web.config啓用（其當你使用d創建一個新的ASP.NET MVC 3項目時，它是默認的EFAULT Visual Studio的模板）：

<appSettings> 
    <add key="ClientValidationEnabled" value="true"/> 
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/> 
</appSettings> 

如果你想處理自定義屬性驗證，你可以，但它可能是一個little more painful。一旦你面對現實世界的應用程序，並意識到使用屬性（數據註釋）聲明性驗證的弱點，我會強烈建議你檢查FluentValidation.NET。