共用方式為


執行簡單的驗證 (C#)

作者:Stephen Walther

了解如何在 ASP.NET MVC 應用程式中執行驗證。 在此教學課程中,Stephen Walther 會介紹模型狀態和驗證 HTML 協助程式。

此教學課程的目標是說明如何在 ASP.NET MVC 應用程式中執行驗證。 例如,您了解如何防止有人提交未包含必要欄位值的表單。 您了解如何使用模型狀態和驗證 HTML 協助程式。

了解模型狀態

您可以使用模型狀態 (或更準確地說為模型狀態字典) 代表驗證錯誤。 例如,清單 1 中的 Create() 動作會先驗證 Product 類別的屬性,再將 Product 類別新增至資料庫。

不建議您將驗證或資料庫邏輯新增至控制器。 控制器應該只包含與應用程式流程控制相關的邏輯。 我們正在採取可讓事情變得更簡單的捷徑。

清單1 - Controllers\ProductController.cs

//
// POST: /Product/Create

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Create([Bind(Exclude="Id")] Product productToCreate)
{
    // Validation logic
    if (productToCreate.Name.Trim().Length == 0)
        ModelState.AddModelError("Name", "Name is required.");
    if (productToCreate.Description.Trim().Length == 0)
        ModelState.AddModelError("Description", "Description is required.");
    if (productToCreate.UnitsInStock

在清單 1 中,會驗證 Product 類別的 Name、Description 和 UnitsInStock 屬性。 如果上述任何屬性未成功,驗證測試會將錯誤新增至模型狀態字典 (以 Controller 類別的 ModelState 屬性表示)。

如果模型狀態有任何錯誤,ModelState.IsValid 屬性會傳回 false。 在此情況下,用於建立新產品的 HTML 表單會重新顯示。 否則,如果沒有驗證錯誤,就會將新的 Product 新增至資料庫。

使用驗證協助程式

ASP.NET MVC 架構包含兩個驗證協助程式:Html.ValidationMessage() 協助程式和 Html.ValidationSummary() 協助程式。 您可以在檢視中使用這兩個協助程式來顯示驗證錯誤訊息。

Html.ValidationMessage() 和 Html.ValidationSummary() 協助程式會用於由 ASP.NET MVC Scaffolding 自動產生的建立和編輯檢視表中。 遵循下列步驟以產生建立檢視表:

  1. 以滑鼠右鍵按一下產品控制器中的 Create() 動作,然後選取 [新增檢視] 功能表選項 (參見圖 1)。
  2. 在 [新增檢視] 對話方塊中,勾選標示為 [建立強型別檢視] 核取方塊 (參見圖 2)。
  3. 從 [檢視資料類別] 下拉式清單中,選取 Product 類別。
  4. 從 [檢視內容] 下拉式清單中,選取 [建立]。
  5. 按一下 [新增] 按鈕。

在新增檢視之前,請確定您建置應用程式。 否則,類別清單不會出現在 [檢視資料類別] 下拉式清單中。

程式碼編輯器中產品控制器 cs 檔案的螢幕擷取畫面,其中顯示滑鼠右鍵功能表,並醒目提示 [新增檢視] 功能表項目。

圖 01:新增檢視 (按一下以檢視全尺寸影像)

[新增檢視] 對話方塊的螢幕擷取畫面,其中顯示已填入 [建立強型別檢視] 核取方塊。

圖 02:建立強型別檢視 (按一下以檢視全尺寸影像)

完成這些步驟之後,您會在清單 2 中取得建立檢視表。

清單 2 - Views\Product\Create.aspx

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<MvcApplication1.Models.Product>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<title>Create</title>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>Create</h2>

    <%= Html.ValidationSummary() %>

    <% using (Html.BeginForm()) {%>

        <fieldset>
            <legend>Fields</legend>
            <p>
                <label for="Name">Name:</label>
                <%= Html.TextBox("Name") %>
                <%= Html.ValidationMessage("Name", "*") %>
            </p>
            <p>
                <label for="Description">Description:</label>
                <%= Html.TextBox("Description") %>
                <%= Html.ValidationMessage("Description", "*") %>
            </p>
            <p>
                <label for="Price">Price:</label>
                <%= Html.TextBox("Price") %>
                <%= Html.ValidationMessage("Price", "*") %>
            </p>
            <p>
                <label for="UnitsInStock">UnitsInStock:</label>
                <%= Html.TextBox("UnitsInStock") %>
                <%= Html.ValidationMessage("UnitsInStock", "*") %>
            </p>
            <p>
                <input type="submit" value="Create" />
            </p>
        </fieldset>

    <% } %>

    <div>
        <%=Html.ActionLink("Back to List", "Index") %>
    </div>

</asp:Content>

在清單 2 中,Html.ValidationSummary() 協助程式會立即在 HTML 表單上方呼叫。 此協助程式用來顯示驗證錯誤訊息的清單。 Html.ValidationSummary() 協助程式會在項目符號清單中轉譯錯誤。

Html.ValidationMessage() 協助程式會在每個 HTML 表單欄位旁邊呼叫。 此協助程式用於在表單欄位旁邊顯示錯誤訊息。 在清單 2 的案例中,Html.ValidationMessage() 協助程式會在發生錯誤時顯示星號。

圖 3 中的頁面說明了當提交的表單缺少欄位和無效值時,驗證協助程式轉譯的錯誤訊息。

Internet Explorer 視窗的螢幕擷取畫面,其中顯示包含填入無效值的欄位所產生錯誤訊息的 [建立] 檢視表。

圖 03:提交有問題的建立檢視 (按一下以檢視全尺寸影像)

請注意,當發生驗證錯誤時,也會修改 HTML 輸入欄位的外觀。 當存在與 Html.TextBox() 協助程式所轉譯之屬性相關聯的驗證錯誤時,Html.TextBox() 協助程式會轉譯 class="input-validation-error" 屬性。

有三個階層式樣式表類別可用於控制驗證錯誤的外觀:

  • input-validation-error - 套用至 Html.TextBox() 協助程式所轉譯的 <input> 標籤。
  • field-validation-error - 套用至 Html.ValidationMessage() 協助程式所轉譯的 <span> 標籤。
  • validation-summary-errors - 套用至 Html.ValidationSummary() 協助程式所轉譯的 <ul> 標籤。

您可以修改這些階層式樣式表類別,因此修改位於 [內容] 資料夾中的 Site.css 檔案,以修改驗證錯誤的外觀。

注意

HtmlHelper 類別包含唯讀靜態屬性,用於擷取與驗證相關之 CSS 類別的名稱。 這些靜態屬性名為 ValidationInputCssClassName、ValidationFieldCssClassName 和 ValidationSummaryCssClassName。

預先繫結驗證和後置繫結驗證

如果您提交 HTML 表單來建立產品,而且您輸入了無效的價格欄位值,而且 UnitsInStock 欄位沒有值,則您會取得圖 4 中顯示的驗證訊息。 這些驗證錯誤訊息來自何處?

Internet Explorer 視窗的螢幕擷取畫面,其中顯示 [股票] 欄位中的 [價格] 和 [單位] 正在標示驗證錯誤。

圖 04:預先繫結驗證錯誤 (按一下以檢視全尺寸影像)

實際上有兩種類型的驗證錯誤訊息 - 在 HTML 表單欄位繫結至類別之前所產生的錯誤訊息,以及表單欄位繫結至類別後產生的訊息。 換句話說,有預先繫結驗證錯誤和後置繫結驗證錯誤。

清單 1 中產品控制器所公開的 Create() 動作會接受 Product 類別的執行個體。 Create 方法的簽章如下所示:

public ActionResult Create([Bind(Exclude="Id")] Product productToCreate)

Create 表單的 HTML 表單欄位的值,會由稱為模型繫結器的項目繫結至 productToCreate 類別。 預設模型繫結器會在無法將表單欄位繫結至表單屬性時,自動將錯誤訊息新增至模型狀態。

預設模型繫結器無法將字串 "apple" 繫結至 Product 類別的 Price 屬性。 您無法將字串指派給十進位屬性。 因此,模型繫結器會將錯誤新增至模型狀態。

預設模型繫結器也無法將 Null 值指派給不接受 Null 的屬性。 模型繫結器尤其無法將 Null 值指派給 UnitsInStock 屬性。 模型繫結器會再一次放棄,並將錯誤訊息新增至模型狀態。

如果您想要自訂這些預先繫結錯誤訊息的外觀,則必須為這些訊息建立資源字串。

摘要

本教學課程的目標是說明 ASP.NET MVC 架構中驗證的基本機制。 您已了解如何使用模型狀態和驗證 HTML 協助程式。 我們也討論了預先繫結和後置繫結驗證之間的差異。 在其他教學課程中,我們將會討論將驗證程式碼移出控制器和移入模型類別的各種策略。