Asp.Net MVC4入門指南（8）：給資料模型添加校正器

在本節中將會給Movie模型添加驗證邏輯。並且確保這些驗證規則在使用者建立或編輯電影時被執行。

保持事情 DRY

ASP.NET MVC 的核心設計信條之一是DRY: "不要重複自己Don’t Repeat Yourself）"。ASP.NET MVC鼓勵您指定功能或者行為，只做一次，然後將它應用到應用程式的各個地方。這可以減少您需要編寫的代碼量，並減少代碼出錯率，易於代碼維護。

給ASP.NET MVC 和 Entity Framework Code First 提供驗證支援是 DRY 信條的一次偉大實踐。您可以在一個地方 模型類） 中以聲明的方式指定驗證規則，這個規則會在應用程式中的任何地方執行。

讓我們看看您如何在本電影應用程式中，使用此驗證支援。

給電影模型添加驗證規則

您將首先向Movie類添加一些驗證邏輯。

開啟Movie.cs檔案。在檔案的頂部添加using語句，從而引用System.ComponentModel.DataAnnotations命名空間：

using System.ComponentModel.DataAnnotations;

注意，該命名空間不包含System.Web。DataAnnotations 提供了一組內建的驗證特性，您可以以聲明的方式，應用於任何類或屬性。

更新Movie類，以利用內建的Required、 StringLength和Range驗證屬性。以下面的代碼為例，以應用驗證屬性。

?

運行該應用程式，您會再次得到了以下的執行階段錯誤：

The model backing the 'MovieDBContext' context has changed since the database was created. Consider using Code First Migrations to update the database (http://go.microsoft.com/fwlink/?LinkId=238269).

我們將使用Migrations來更新 Schema。產生解決方案，然後開啟軟體包管理器控制台視窗，並輸入以下命令：

add-migration AddDataAnnotationsMig
update-database

當此命令完後，Visual Studio會開啟指定名稱 AddDataAnnotationsMig）的檔案，其中定義了派生自DbMIgration的新類，並在Up方法中，您可以看到代碼更新的Schema 和約束條件。Title 和Genre 欄位不再可以為 null 即，您必須輸入一個值） 並且Rating 欄位具有最大長度是 5。

驗證屬性將指定一個驗證行為，這樣您可以指定模型中的那個屬性需要被強制驗證。Required屬性指示該屬性必須有一個值 ，在此樣本中，一部電影必須要有Title、 ReleaseDate、Genre和Price屬性的值，這樣才有效。Range屬性限制了一個指定範圍內的值。StringLength屬性允許您設定一個字串屬性的最大長度和其最小長度可選）。內部類型 例如decimal, int, float, DateTime）預設是必須的，所以不需要Required 屬性。

Code First 確保您在模型類上所指定的驗證規則，會在應用程式修改資料庫之前執行。例如，下面的代碼在調用SaveChanges方法時，將引發異常，因為缺失幾個必需的Movie屬性值，並且價格為零 這在有效範圍之外）。

?

驗證規則會自動被 .NET Framework執行，這將有助於使您的應用程式更加的可靠。它還確保你不會因為忘了驗證，無意中使得壞的資料也寫入到了資料庫。

下面是更新後的Movie.cs檔案的完整代碼清單：

?ASP.NET MVC 的驗證錯誤UI

重新運行應用程式，瀏覽 /Movies的 URL。

單擊Create New連結，來添加一部新電影。在表單中填寫一些無效值，然後單擊Create按鈕。

650) this.width=650;" style="border-top-width:0px;border-bottom-width:0px;border-left-width:0px;border-right-:" title="image" border="0" alt="image" width="564" height="752" src="http://www.bkjia.com/uploads/allimg/131228/115F25J5-0.png" />

注意，為了使jQuery支援使用逗號的非英語地區的驗證 ，需要設定逗號"，"）來表示小數點，你需要引入globalize.js並且你還需要具體的指定cultures/globalize.cultures.js檔案 地址在https://github.com/jquery/globalize) 在 JavaScript 中可以使用 Globalize.parseFloat。下面的代碼展示了在"FR-FR" Culture下的Views\Movies\Edit.cshtml 視圖：

?

為了使用這種使用者驗證介面，真正的好處是，您不需要修改MoviesController類或Create.cshtml視圖中的任何一行代碼。在本教程之前所產生的控制器和視圖中，Movie模型類的屬性上所指定的驗證規則一樣可以自動適用。

您可能已經注意到了Title 和Genre屬性，在欄位中輸入文本或者刪除文本，是不會執行所需的驗證屬性的，直到您提交表單 (點Create按鈕)時才執行。對於欄位是最初為空白 如建立視圖中的欄位） 和只有Required屬性並沒有其它驗證屬性的欄位，您可以執行以下操作來觸發驗證：

1. Tab into the field.

2. Enter some text.

3. Tab out.

4. Tab back into the field.

5. Remove the text.

6. Tab out.

上面的順序將觸發必需的驗證，而並不需要點擊提交按鈕。在不輸入任何欄位的情況下，直接點擊提交按鈕，將觸發用戶端驗證。直到沒有用戶端驗證錯誤的情況下，表單資料才會發送到伺服器。您可以在伺服器端HTTP Post 方法上加上斷點來測試一下，或者使用Fiddler tool或 IE 9 F12 Developer tools.

650) this.width=650;" style="border-top-width:0px;border-bottom-width:0px;border-left-width:0px;border-right-:" title="image" border="0" alt="image" width="564" height="751" src="http://www.bkjia.com/uploads/allimg/131228/115F22H9-1.png" />

如何驗證建立視圖和建立方法

您可能很想知道驗證使用者介面在沒有更新控制器或視圖代碼的情況下是如何產生的。下面列出了MovieController類中的Create方法。它們是之前教程中自動產生的，並沒有修改。

?

第一種HTTP GET）Create 方法用來顯示初始的建立form。第二個 [HttpPost]） 方法處理form的請求。第二種Create方法 HttpPost 版本） 調用 ModelState.IsValid來檢查是否有的任何的Movie驗證錯誤。調用此方法將驗證對象上所有應用了驗證約束的屬性。如果對象含有驗證錯誤，則Create方法會重新顯示初始的form。如果沒有任何錯誤，方法將儲存資訊到資料庫。在我們的電影樣本中，我們使用了驗證，當用戶端檢測到錯誤時，form不會被post到伺服器；所以第二個Create方法永遠不會被調用。如果您在瀏覽器中禁用了 JavaScript，用戶端驗證也會被禁用，HTTP POST Create方法會調用 ModelState.IsValid來檢查影片是否含有任何驗證錯誤。

您可以在HttpPost Create方法中設定一個斷點，當用戶端驗證檢測到錯誤時，不會post form資料，所以永遠不會調用該方法。如果您在瀏覽器中禁用 JavaScript，然後提交具有錯誤資訊的form，斷點將會命中。您仍然得到充分的驗證，即使在沒有 JavaScript的情況下。顯示了如何禁用 Internet Explorer 中的 JavaScript。

650) this.width=650;" style="border-top-width:0px;border-bottom-width:0px;border-left-width:0px;border-right-:" title="image" border="0" alt="image" width="455" height="968" src="http://www.bkjia.com/uploads/allimg/131228/115F25528-2.png" />

650) this.width=650;" style="border-top-width:0px;border-bottom-width:0px;border-left-width:0px;border-right-:" title="image" border="0" alt="image" width="463" height="223" src="http://www.bkjia.com/uploads/allimg/131228/115F24239-3.png" />

顯示了如何在Firefox瀏覽器中禁用 JavaScript。

650) this.width=650;" style="border-top-width:0px;border-bottom-width:0px;border-left-width:0px;border-right-:" title="image" border="0" alt="image" width="537" height="489" src="http://www.bkjia.com/uploads/allimg/131228/115F25B1-4.png" />

顯示了如何在 Chrome 瀏覽器中禁用 JavaScript。

650) this.width=650;" style="border-top-width:0px;border-bottom-width:0px;border-left-width:0px;border-right-:" title="image" border="0" alt="image" width="623" height="806" src="http://www.bkjia.com/uploads/allimg/131228/115F21063-5.png" />

下面是架構代碼在之前的教程中產生的Create.cshtml視圖模板。它用來為以上兩個操作方法來顯示初始的form，同時在驗證出錯時來重新顯示視圖。

?

請注意，代碼如何使用Html.EditorFor helper 輸出為Movie中的每個屬性的<input>元素。此Helper旁邊是對Html.ValidationMessageFor方法的調用。這兩個Helper方法將處理由控制器傳遞到視圖的模型對象在這裡是，Movie對象）。它們會自動尋找模型中指定的驗證屬性，並顯示適當的錯誤訊息。

如果您想要在後面更改驗證邏輯，您可以做在一個地方，將驗證資訊添加到模型上。 此樣本中，是movie 類）。您不必擔心不符合規則 ，驗證邏輯會在應用程式的不同部分執行——在一個地方定義驗證邏輯將會被使用到各個地方。這使代碼非常乾淨，並使它易於維護和擴充。它意味著您會完全遵守DRY原則。

給影片模型添加Formatting

開啟Movie.cs檔案並查看Movie 類。System.ComponentModel.DataAnnotations命名空間提供了內建的驗證特性集的格式屬性。我們已經為發布日期和價格欄位應用了DataType枚舉值。下面的程式碼範例了ReleaseDate和Price屬性與相應的DisplayFormat屬性。

?

DataType屬性不是驗證特性，它們用來告訴視圖引擎如何Render HTML 。在上面的樣本中， DataType.Date屬性將影片日期顯示為日期，例如，下面的DataType屬性不會驗證資料的格式：

[DataType(DataType.EmailAddress)]
 [DataType(DataType.PhoneNumber)]
 [DataType(DataType.Url)]

上面列出的屬性只提供視圖引擎來顯示資料的格式如：<a> 為 URL ，< href="mailto:EmailAddress.com"> 為電子郵件。您可以使用Regex屬性來驗證資料的格式。）

另一種使用DataType 屬性的方式，您可以顯式設定DataFormatString。下面的程式碼範例了具有一個日期格式字串的Release Date屬性 即"d")。

       [DisplayFormat(DataFormatString = "{0:d}")]
        public DateTime ReleaseDate { get; set; }

下面的代碼設定Price屬性為貨幣格式。

       [DisplayFormat(DataFormatString = "{0:c}")]
        public decimal Price { get; set; }

完整的Movie 類如下所示。

?

運行該應用程式並瀏覽到Movies控制器。很好的格式化了發布日期和價格。顯示了Release Date和使用 "FR-FR" Culture 的Price。

650) this.width=650;" style="border-top-width:0px;border-bottom-width:0px;border-left-width:0px;border-right-:" title="image" border="0" alt="image" width="679" height="672" src="http://www.bkjia.com/uploads/allimg/131228/115F23540-6.png" />

為預設Culture的顯示English US） 。

650) this.width=650;" style="border-top-width:0px;border-bottom-width:0px;border-left-width:0px;border-right-:" title="image" border="0" alt="image" width="676" height="665" src="http://www.bkjia.com/uploads/allimg/131228/115F23a3-7.png" />

在下一部分，我們先會看看代碼，然後再改進一下自動產生的Details 和 Delete 方法。

--------------------------------------------------------------------------------------------------------------------

譯者註：

本系列共9篇文章，翻譯自Asp.Net MVC4 官方教程，由於本系列文章言簡意賅，篇幅適中，從一個樣本開始講解，全文最終完成了一個管理影片的小系統，非常適合新手入門Asp.Net MVC4，並由此開始開發工作。9篇文章為：

1. Asp.Net MVC4 入門介紹

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/intro-to-aspnet-mvc-4

· 譯文地址：http://www.cnblogs.com/powertoolsteam/archive/2012/11/01/2749906.html

2. 添加一個控制器

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-controller

· 譯文地址：http://www.cnblogs.com/powertoolsteam/archive/2012/11/02/2751015.html

3. 添加一個視圖

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-view

· 譯文地址：http://www.cnblogs.com/powertoolsteam/archive/2012/11/06/2756711.html

4. 添加一個模型

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-model

· 譯文地址：http://www.cnblogs.com/powertoolsteam/archive/2012/12/17/2821495.html

5. 從控制器訪問資料模型

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/accessing-your-models-data-from-a-controller

· 譯文地址：http://www.cnblogs.com/powertoolsteam/archive/2013/01/11/2855935.html

6. 驗證編輯方法和編輯檢視

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/examining-the-edit-methods-and-edit-view

· 譯文地址：http://www.cnblogs.com/powertoolsteam/archive/2013/01/24/2874622.html

7. 給電影表和模型添加新欄位

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-a-new-field-to-the-movie-model-and-table

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1140334

8. 給資料模型添加校正器

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/adding-validation-to-the-model

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1147449

9. 查詢詳細資料和刪除記錄

· 原文地址：http://www.asp.net/mvc/tutorials/mvc-4/getting-started-with-aspnet-mvc4/examining-the-details-and-delete-methods

· 譯文地址：http://powertoolsteam.blog.51cto.com/2369428/1149311

10.第三方控制項Studio for ASP.NET Wijmo MVC4 工具應用

· 地址：http://powertoolsteam.blog.51cto.com/2369428/1196469