首頁 > 開發者 > ASP

ASP.NET Web Forms 4.5的新特性（二）：針對HTML5的更新和Unobtrusive Validation

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

在前一篇文章中我們介紹了兩個新特性：強型別資料控制項和Bundling。

這次我們再介紹兩個新特性：ASP.NET Web Forms 4.5中針對HTML5的更新和Unobtrusive Validation。

針對HTML5的更新

在ASP.NET Web Forms 4.5中，控制項TextBox的TextBoxMode從之前的三個（SingleLine/MultiLine/Password）增加到了16個，詳細見MSDN。

 

這樣使得做表單類頁面的時候，降會大大地降低驗證的代碼量，提高開發效率，將更多的人力資源放在商務邏輯上。

FileUpload控制項終於開始支援多檔案上傳，可以通過AllowMultiple屬性開啟。

詳細使用可以參照MSDN的FileUpload類說明。

當然還包含了如對HTML5表單的驗證、HTML5的標記也可以使用“~”去根目錄、增加UpdatePanel對HTML5表單的支援。

Unobtrusive Validation

所謂Unobtrusive Validation，就是一種隱式的驗證方式，將驗證代碼和HTML分離。

要具體瞭解其改進，我們先看看ASP.NET Web Forms 4.5之前是怎麼處理驗證邏輯的。

我們在頁面中添加了這個簡單的輸入表單。

 1 <body>
 2     <form id="form1" runat="server">
 3         <div>
 4             <ul>
 5                 <li>
 6                     <asp:TextBox ID="TextBox_Number" runat="server" TextMode="SingleLine"></asp:TextBox>
 7                     <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
 8                         ErrorMessage="*Required"
 9                         ControlToValidate="TextBox_Number"
10                         EnableClientScript="true"></asp:RequiredFieldValidator>
11                     <asp:RangeValidator ID="RangeValidator1" runat="server"
12                         ControlToValidate="TextBox_Number"
13                         ErrorMessage="*Range 10~100"
14                         MaximumValue="100"
15                         MinimumValue="10"></asp:RangeValidator>
16                 </li>
17                 <li>
18                     <asp:Button ID="Button1" runat="server" Text="Submit" /></li>
19             </ul>
20         </div>
21     </form>
22 </body>

當我們查看頁面產生的原始碼的時候，會發現下面這樣的內容。

後台將驗證的JS代碼放在了頁面中，而當頁面驗證邏輯很複雜的時候，會產生大量的內聯代碼，在後面對頁面做最佳化（如JS壓縮，CDN，頁面壓縮）、維護的時候很不方便。

而在ASP.NET Web Forms 4.5中可以將此類的驗證邏輯做分離。

可以在Web.config中添加下面這樣的配置。

1   <appSettings>
2     <!--啟用Unobtrusive Validation，預設開啟-->
3     <add key="ValidationSettings:UnobtrusiveValidationMode" value="WebForm"/>
4 
5     <!--關閉Unobtrusive Validation-->
6     <!--<add key="ValidationSettings:UnobtrusiveValidationMode" value="None"/>-->
7   </appSettings>

或者在Application_Start中添加此段即可。

1 void Application_Start(object sender, EventArgs e)
2 {
3     //Enabling UnobtrusiveValidation application wide
4     ValidationSettings.UnobtrusiveValidationMode = UnobtrusiveValidationMode.WebForms;
5 }

而如果只想控制某個頁面開啟此功能只需加上這段代碼。

1 Page.UnobtrusiveValidationMode = System.Web.UI.UnobtrusiveValidationMode.WebForms;

現在我們再來看看產生到用戶端的HTML代碼的樣子。

我們發現，驗證類的資訊已經變成了HTML5中的表單特有的屬性data-*

而頁面中的內聯JS等內容都已經被處理，且自動引入了jQuery進行驗證，這部分可以參考Unobtrusive JavaScript。

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More