學習ASP.NET Core Razor 編程系列十二——在頁面中增長校驗

在Visual Studio 2017的解決方案資源管理器中，打開 Models\Book.cs 文件。 DataAnnotations 提供一組內置的校驗規則特性，咱們能夠經過聲明的方式應用於類或屬性之上。 DataAnnotations 還包含 DataType 等格式特性，有助於格式設置但不提供驗證。

如今咱們來給Book 類使用 Required、StringLength、RegularExpression 和 Range 校驗規則特性，代碼以下所示。

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks; 

namespace RazorMvcBooks.Models
{

    public class Book
    {  

        public int ID { get; set; }
  [Required]
        [StringLength(50, MinimumLength = 2)]
        public string Name { get; set; }
        [Display(Name = "出版日期")]
        [DataType(DataType.Date)] 

        public DateTime ReleaseDate { get; set; }
        [Range(1,200)]
        [DataType(DataType.Currency)]
        public decimal Price { get; set; }
        [RegularExpression(@"^[A-Z]+[a-zA-Z""'\s-]*$"), Required, StringLength(30)]

        public string Author { get; set; }
        [Required]
        public string Publishing { get; set; }

    }
}

校驗特性用在實體類的屬性上，而且將前端強制執行。

Required 和 MinimumLength 特性表示屬性必須具備一個值。可是，用戶能夠隨時輸入空格對能夠爲 null 的類型進行校驗約束。從本質上來講，對於不能爲 null 的值類型（如 decimal、int、float 和 DateTime），能夠不添加 Required 特性。

RegularExpression 特性限制用戶能夠輸入的字符。在上述代碼中， Rating 只能輸入字母（禁用空格、數字和特殊字符）。

Range 特性將值限制在指定範圍內。

StringLength 特性設置字符串的最大長度，且可視狀況設置最小長度。

讓 ASP.NET Core 強制自動執行校驗規則有助於提高應用程序的可靠性。在實體類上進行自動校驗助於保護應用程序，由於添加新代碼時無需手動修改舊代碼。

3、查看面中的校驗信息

在Visual Studio 2017中按F5運行應用程序，並在瀏覽器中瀏覽到書籍列表頁面。

在書籍列表頁面，使用鼠標左鍵點擊「Create」連接。在新建頁面中的輸入框中輸入一些無效值。當jQuery客戶端校驗檢測到錯誤時，它會顯示一條錯誤消息。以下圖。

備註

你可能沒法在 Price 字段中輸入小數點或逗號。若要使 jQuery 校驗支持非英英語環境中使用逗號（「,」）表替小數點，以及使用非美式英語日期格式，你必須採起應用全球化設置來改變你的應用程序。

請注意，表單在包含無效值的每一個字段下自動呈現一個適當的校驗錯誤消息。錯誤包括客戶端（使用 JavaScript 和 jQuery ）和服務器端（當用戶禁用JavaScript時）。

一項重要好處是，無需在「建立」或「編輯」頁面中更改代碼。一量在在實體類上應用 DataAnnotations 後，即已啓用校驗UI。本教程中自動建立的 Razor 頁面自動選取了校驗規則（使用Book類的屬性上的校驗特性）。使用「編輯」頁面測試驗證後，全部應用這個Book類的頁面都應用了相同校驗規則。

存在客戶端驗證錯誤時，不會將表單數據提交到後臺服務器。你可使用如下一種或多種方法驗證是否未發佈表單數據：

1) 在 OnPostAsync 方法中放置一個斷點。提交表單（選擇「Create」或「Save」）。從未命中斷點。

2) 使用 Fiddler 工具。

3) 使用瀏覽器開發人員工具監視網絡流量。

4、服務器端驗證

首先咱們在瀏覽器中禁用 JavaScript，即不進行客戶端校驗，而後把有錯誤的數據提交到後臺服務器。

測試服務器端驗證：

1. 在瀏覽器中禁用 JavaScript。若是你的瀏覽器中沒法禁用 JavaScript，請試試其餘瀏覽器。

2. 在「新建」或「編輯」頁面的 OnPostAsync 方法中設置斷點。

3. 提交帶有不符全校驗規則的表單數據。

4. 查看一下OnPostAsync方法中是否有如下代碼。

     if (!ModelState.IsValid)
     {
        return Page();
     }

5. 結果以下圖。

如下代碼顯示了以前在本教程中設定其基架的「Create.cshtml」的一部分。它用於在「建立」和「編輯」頁面中顯示初始表單並在發生錯誤後從新顯示錶單。

  <form method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Book.Name" class="control-label"></label>
                <input asp-for="Book.Name" class="form-control" />
                <span asp-validation-for="Book.Name" class="text-danger"></span>
            </div>

輸入輔助助手使用 DataAnnotations 特性並在客戶端生成 jQuery 校驗所需的 HTML 元素。校驗輔助助手用於顯示校驗錯誤。

「建立」和「編輯」頁面中沒有校驗規則。校驗規則和錯誤字符串僅可在BOOK 類中指定。這些校驗規則將自動應用於編輯頁面。

當須要修改校驗邏輯時，也只能在該Book實體類中修改。校驗將始終在整個應用程序中應用（校驗邏輯在一處定義）。在一個地方進行校驗有助於保持代碼乾淨，且更易於維護和更新。

5、使用DataType特性

如今咱們在Visual Studio 2017中修改Book類。 DataAnnotations除了提供一組內置的驗證特性，System.ComponentModel.DataAnnotations 命名空間還提供格式特性。咱們來看一下DataType 特性應用於 ReleaseDate 和 Price 屬性。代碼以下。

        [Display(Name = "出版日期")]
        [DataType(DataType.Date)] 

        public DateTime ReleaseDate { get; set; }
        [Range(1,200)]

        [DataType(DataType.Currency)]
        public decimal Price { get; set; }

DataType 特性僅提供相關提示來幫助視圖引擎設置數據格式（例如向 URL 提供 <a> 和向電子郵件提供 <a href="mailto:test@163.com">）。使用正則表達式(RegularExpression)特性校驗數據的格式。 DataType 特性用於指定比數據庫內部類型更具體的數據類型。 DataType 特性不是校驗特性。示例應用程序中「出版日期」僅顯示日期，不顯示時間。

DtaType 枚舉提供了多種數據類型，例如日期、時間、電話號碼、貨幣、電子郵件地址等。 DataType特性的使用可以使應用程序自動提供特定數據類型的功能。例如，可爲 DataType.EmailAddress 建立 mailto: 連接。若是瀏覽器支持 HTML5 ，DataType.Date類型瀏覽器將提供日期選擇器，以下圖。

DataType 特性發出 HTML 5 特性供支持HTML 5 瀏覽器使用。 DataType 特性不提供任何校驗。

DataType.Date 不指定顯示日期的格式。默認狀況下，日期數據格式基於服務器的 CultureInfo 的默認格式進行顯示。

DisplayFormat 特性用於顯式指定日期格式：例如

    [DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
        public DateTime ReleaseDate { get; set; }

ApplyFormatInEditMode 設置用於指定在顯示值進行編輯時須要顯示的格式。在某些場景中，您可能不但願某些字段具備此行爲。例如，在貨幣值中，可能不但願編輯 UI 中使用貨幣符號。

可單獨使用 DisplayFormat 特性，但一般建議使用 DataType 特性。 DataType 特性傳遞數據的語義而不是傳遞如何在前端界面上呈現數據，DataType具體 DisplayFormat 不具有的如下優點：

瀏覽器若是支持HTML5，則會自動顯示相應的一些控件與功能（例如顯示日期控件、區域設置適用的貨幣符號、電子郵件連接等）。
默認狀況下，瀏覽器將根據您在區域設置中設置的區域採用正確的格式呈現數據。
DataType特性可使ASP.NET Core框架可選擇適當的字段模板來呈現數據。若是單獨使用時，可使用DisplayFormat 特性的顯式的指定數據格式。

注：jQuery校驗不能校驗日期範圍與日期時間。例如，在Book類中添加下面的代碼，在瀏覽器中輸入任何日期，都是顯示校驗錯誤，即便選擇的日期是在指定的範圍以內，以下圖：

      [Display(Name = "出版日期")]
        [Range(typeof(DateTime), "1980/1/1", "2050/1/1")]
        public DateTime ReleaseDate { get; set; }

一般，在實體類中設置固定日期是不合適的，所以不推薦使用 Range 特性和 DateTime特性。

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。