zoukankan      html  css  js  c++  java
  • ASP.NET Web Forms 4.5的新特性

    作者:Parry
    出处:http://www.cnblogs.com/parry/

    一、强类型数据控件

    在出现强类型数据控件前,我们绑定数据控件时,前台一般使用Eval或者DataBinder.Eval(Container.DataItem,"FieldName")的形式。

    1 <%# DataBinder.Eval(Container.DataItem,"FieldName") %>
    2 <%# Eval("FieldName") %>

    而在ASP.NET Web Forms 4.5中出现了强类型数据控件,可以后台绑定数据的控件多了个属性:ItemType

    当指定了控件的ItemType后就可以在前台使用强类型绑定数据了。

    指定ItemType。

    使用强类型绑定数据。

    届时园子里估计又要掀起一番争论ORM的风潮 :)

     

    二、Bundling

    不怎么好翻译,类似于资源文件的压缩包,索性不翻译它了。

    我们知道Web性能优化的一个主要的方法就是减少HTTP请求,详细可见YSlow里面的Minimize HTTP Requests

    由此才出现了css sprite、压缩CSS/JS的工具,目的都是为了尽量减少HTTP的请求。

    之前.NET框架下会有很多的第三方框架,微软也出过一个Microsoft Ajax Minifier,我也曾经也过一篇文章介绍过。

    而这次在ASP.NET Web Forms 4.5中,索性直接添加了此功能,多了一个叫做Bundle的类。

    复制代码
     1 public class BundleConfig
     2     {
     3         // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254726
     4         public static void RegisterBundles(BundleCollection bundles)
     5         {
     6             bundles.Add(new ScriptBundle("~/bundles/WebFormsJs").Include(
     7                   "~/Scripts/WebForms/WebForms.js",
     8                   "~/Scripts/WebForms/WebUIValidation.js",
     9                   "~/Scripts/WebForms/MenuStandards.js",
    10                   "~/Scripts/WebForms/Focus.js",
    11                   "~/Scripts/WebForms/GridView.js",
    12                   "~/Scripts/WebForms/DetailsView.js",
    13                   "~/Scripts/WebForms/TreeView.js",
    14                   "~/Scripts/WebForms/WebParts.js"));
    15 
    16             bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
    17                     "~/Scripts/jquery-{version}.js"));
    18 
    19             bundles.Add(new ScriptBundle("~/bundles/MsAjaxJs").Include(
    20                 "~/Scripts/WebForms/MsAjax/MicrosoftAjax.js",
    21                 "~/Scripts/WebForms/MsAjax/MicrosoftAjaxApplicationServices.js",
    22                 "~/Scripts/WebForms/MsAjax/MicrosoftAjaxTimer.js",
    23                 "~/Scripts/WebForms/MsAjax/MicrosoftAjaxWebForms.js"));
    24 
    25             bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
    26                   "~/Content/themes/base/jquery.ui.core.css",
    27                   "~/Content/themes/base/jquery.ui.resizable.css",
    28                   "~/Content/themes/base/jquery.ui.selectable.css",
    29                   "~/Content/themes/base/jquery.ui.accordion.css",
    30                   "~/Content/themes/base/jquery.ui.autocomplete.css",
    31                   "~/Content/themes/base/jquery.ui.button.css",
    32                   "~/Content/themes/base/jquery.ui.dialog.css",
    33                   "~/Content/themes/base/jquery.ui.slider.css",
    34                   "~/Content/themes/base/jquery.ui.tabs.css",
    35                   "~/Content/themes/base/jquery.ui.datepicker.css",
    36                   "~/Content/themes/base/jquery.ui.progressbar.css",
    37                   "~/Content/themes/base/jquery.ui.theme.css"));
    38         }
    39     }
    复制代码

    Bundle还支持将CSS压缩的文件配置写在config文件里,使得维护更加方便,同时也支持CDN和文件通配符等。

    可以通过在Application_Start里注册配置。

    1 void Application_Start(object sender, EventArgs e)
    2 {
    3     BundleConfig.RegisterBundles(BundleTable.Bundles);
    4 }

    使用。

    1 <%: Scripts.Render("~/bundles/modernizr") %>
    2 <%: Scripts.Render("~/bundles/jquery") %>
    3 <%: Scripts.Render("~/bundles/jqueryui") %>

    压缩前后请求数对比(图片来源)。

    压缩合并前。

    压缩后。

    这样,当此属性成为了ASP.NET自带的一个功能后,我们只需要很简单地配置就可以实现优化准则里面的“减少掉HTTP请求数”这一条了。

    三、针对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"/>

    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

    五、Model Binding

    如果用过ObjectDataSource控件,肯定对其SelectMethod有印象,在ASP.NET Web Forms 4.5中,微软直接将此方法移到了强类型控件上。

    将之前DataBind方法直接替换成了更方便的SelectMethod方法,具体参见这里

    SelectMethod方法接受IEnumerable或者IQueryable类型的对象,如果使用了前面介绍的ItemType属性后,就需要接受IEnumerable<T>或者IQueryable<T>类型的对象,T与前面的ItemType一致。

    如我们这样设置一个GridView的配置。

    复制代码
     1 <form id="form1" runat="server">
     2     <div>
     3         <asp:GridView ID="GridView_Users" runat="server" ItemType="ModelBinding.Users"
     4             DataKeyNames="UserID" SelectMethod="GetUsers"
     5             AutoGenerateColumns="False">
     6             <Columns>
     7                 <asp:BoundField DataField="UserID" HeaderText="User ID" />
     8                 <asp:BoundField DataField="UserName" HeaderText="User Name" />
     9                 <asp:BoundField DataField="UserEmail" HeaderText="Email" />
    10             </Columns>
    11         </asp:GridView>
    12         <asp:ValidationSummary ID="ValidationSummary_UserEdit" runat="server" ShowModelStateErrors="true" />
    13     </div>
    14 </form>
    复制代码

    后台绑定数据。

    复制代码
    1 public IQueryable<Users> GetUsers()
    2 {
    3     List<Users> list = new List<Users>();
    4     list.Add(new Users() { UserID = 1, UserName = "Parry", UserEmail = "Parry@cnblogs.com" });
    5     list.Add(new Users() { UserID = 2, UserName = "Spiderman", UserEmail = "Spiderman@cnblogs.com" });
    6     list.Add(new Users() { UserID = 3, UserName = "Superman", UserEmail = "PaSupermanrry@cnblogs.com" });
    7     list.Add(new Users() { UserID = 4, UserName = "Batman", UserEmail = "Batman@cnblogs.com" });
    8     return list.AsQueryable<Users>();
    9 }
    复制代码

    页面显示。

    当然,控件还支持UpdateMethod和DeleteMethod分别进行修改和删除操作。

    需要注意的是,在后台定义的SelectMethod中也是可以定义参数属性的。

    public IQueryable<Users> GetUsers([Control]int? userID)

    还支持Form、QueryString、Cookies、Url这些属性。

    整体感觉这部分是ASP.NET Web Forms 4.5变化较大,也是更像MVC的地方。微软将EF,强类型控件,Model Binding串联起来,定义了一个规整的后台绑定的方法和流程。

    更详细的介绍可以参考ScottGu的系列文章:Web Forms Model Binding

  • 相关阅读:
    (原)Lazarus 异构平台下多层架构思路、DataSet转换核心代码
    (学)新版动态表单研发,阶段成果3
    (学) 如何将 Oracle 序列 重置 清零 How to reset an Oracle sequence
    (学)XtraReport WebService Print 报错
    (原)三星 i6410 刷机 短信 无法 保存 解决 办法
    (原) Devexpress 汉化包 制作工具、测试程序
    linux下网络配置
    apache自带ab.exe小工具使用小结
    Yii::app()用法小结
    PDO使用小结
  • 原文地址:https://www.cnblogs.com/gjhjoy/p/3976117.html
Copyright © 2011-2022 走看看