ASP.NET 4.0新特性之Web.config的改进

ASP.NET 4.0 的新增功能:1.简洁的 web.config 文件 2. 控件的新属性ViewStateMode - 控件的视图状态模式 3. 控件的新属性 ClientIDMode - 生成客户端 ID 的方式 4. 列表控件的新属性EnablePersistedSelection - 保存选中项的方式 5. 控件的其他一些增强点，RenderOuterTable - 指定控件在客户端呈现的时候，是否在外层加 table 标签,Menu 控件,在 asp.net 4.0 中将会以 ul li 的方式呈现在客户端,RepeatLayout - 布局模式，控件在客户端的 HTML 呈现方式,Wizard 和 CreateUserWizard 新增了 LayoutTemplate 模板,  原来使用 ListView 必须要有 LayoutTemplate ，在 asp.net 4.0 中可以不再用它了.

　　示例

　　1、简洁的 web.config，配置信息被移到了 machine.config

　　Web.config

< ?xml version = " 1.0 " ? >

< ! --
    清爽的 web.config
    配置信息一律都放到 machine.config 里了
-->

< configuration >
    
     < system.web >
         < compilation debug = " true " targetFramework = " 4.0 " />
     </ system.web >
    
</ configuration >

 
　　2、ViewStateMode 属性的用法

　　ViewStateDemo.aspx

< %@ Page Title = "" Language = " C# " MasterPageFile = " ~/Site.Master " AutoEventWireup = " true "
    CodeBehind = " ViewStateDemo.aspx.cs " Inherits = " AspDotNet.ViewStateDemo " % >

< asp:Content ID = " Content1 " ContentPlaceHolderID = " head " runat = " server " >
</ asp:Content >
< asp:Content ID = " Content2 " ContentPlaceHolderID = " ContentPlaceHolder1 " runat = " server " >
     < ! --
        ViewStateMode - 控件的视图状态模式
            ViewStateMode.Enabled - 此控件启用 ViewState，并且其子控件中所有 ViewStateMode 为 Inherit 的控件也全部启用 ViewState
            ViewStateMode.Disabled - 此控件禁用 ViewState，并且其子控件中所有 ViewStateMode 为 Inherit 的控件也全部奇偶能用 ViewState
            ViewStateMode.Inherit - 此控件是否启用 ViewState，由其父控件的 ViewStateMode 的值决定
     -->

     < asp:PlaceHolder ID = " PlaceHolder1 " runat = " server " ViewStateMode = " Disabled " >

         < ! -- 无 ViewState -->
         < asp:Label ID = " Label1 " runat = " server " ViewStateMode = " Disabled " />

         < br />

         < ! -- 有 ViewState -->
         < asp:Label ID = " Label2 " runat = " server " ViewStateMode = " Enabled " />

         < br />

         < ! -- 无 ViewState -->
         < asp:Label ID = " Label3 " runat = " server " ViewStateMode = " Inherit " />

     </ asp:PlaceHolder >

     < br />
     < ! -- 点击“回发”按钮后观察各个 Label 控件是否启用了 ViewState -->
     < asp:Button ID = " Button1 " runat = " server " Text = " 回发 " />
</ asp:Content >

 

　　ViewStateDemo.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace AspDotNet
{
     public partial class ViewStateDemo : System.Web.UI.Page
    {
        protected void Page_Load( object sender, EventArgs e)
        {
             // 页面第一次加载时，分别给三个 Label 赋值，用于演示是否启用了 ViewState
             if (!Page.IsPostBack)
            {
                Label1.Text = " Label1 " ;
                Label2.Text = " Label2 " ;
                Label3.Text = " Label3 " ;
            }
        }
    }
}

 

 

　　3、ClientIDMode 属性的用法

　　ClientID.aspx

< %@ Page Title = " ClientID " Language = " C# " MasterPageFile = " ~/Site.Master " AutoEventWireup = " true "
    CodeBehind = " ClientID.aspx.cs " Inherits = " AspDotNet.ClientID " ClientIDMode = " Static " % >

< asp:Content ID = " Content1 " ContentPlaceHolderID = " head " runat = " server " >
</ asp:Content >
< asp:Content ID = " Content2 " ContentPlaceHolderID = " ContentPlaceHolder1 " runat = " server " >
    
     < ! --
        ClientIDMode - 生成客户端 ID 的方式
            ClientIDMode.AutoID - 生成方式和以前一样，为保证唯一，会把其以上各层级的控件ID拿过来拼成一个页面中的唯一ID
            ClientIDMode.Inherit - 继承父控件的客户端ID生成方式
            ClientIDMode.Static - 静态方式。在服务端设置的ID是什么，客户端所呈现的ID就是什么
            ClientIDMode.Predictable - 生成ID的方式为：[Prefix]_[ID]_[Suffix]
        注意：
            在某控件层级中如果没有设置 ClientIDMode，则其默认值为 AutoID
            如果在控件层级中的父级控件设置了 ClientIDMode，则其子控件的默认值为 Inherit
     -->

     < ! -- ClientIDMode.AutoID 的 Demo -->
     < fieldset >
         < legend > Legacy </ legend >
         < asp:TextBox ID = " txtLegacy " ClientIDMode = " AutoID " runat = " server " Text = " ID: txtLegacy " />
     </ fieldset >

     < ! -- ClientIDMode.Static 的 Demo -->
     < fieldset >
         < legend > Static </ legend >
         < asp:TextBox ID = " txtStatic " ClientIDMode = " Static " runat = " server " Text = " ID: txtStatic " />
     </ fieldset >

     < ! -- ClientIDMode.Inherit 的 Demo （注意：Page 上的 ClientIDMode 的值为 Static，所以此控件的客户端ID生成方式也是 Static） -->
     < fieldset >
         < legend > Inherit </ legend >
         < asp:TextBox ID = " txtInherit " ClientIDMode = " Inherit " runat = " server " Text = " ID: txtInherit " />
     </ fieldset >

     < ! -- Predictable 模式中自动分配 Suffix 的方式 -->
     < fieldset >
         < legend > Predictable Repeater </ legend >
         < div id = " repeaterContainer " >
             < asp:Repeater ID = " repeater " runat = " server " ClientIDMode = " Static " >
                 < ItemTemplate >
                     < div >
                         < asp:Label ID = " productPrice " ClientIDMode = " Predictable " runat = " server " >
                         < %# string .Format(System.Globalization.CultureInfo.CurrentUICulture, " {0:c} " , Eval ( " ProductPrice " ))% >
                         </ asp:Label >
                     </ div >
                 </ ItemTemplate >
             </ asp:Repeater >
         </ div >
         < asp:TextBox ID = " txtPredictableRepeater " runat = " server " TextMode = " MultiLine " Rows = " 10 "
            ClientIDMode = " Static " Style = " width: 99%; " />
     </ fieldset >

     < ! -- Predictable 模式中分配指定 Suffix 的方式（ClientIDRowSuffix 指定 Suffix 的数据来源） -->
     < fieldset >
         < legend > Predictable ListView </ legend >
         < asp:ListView ID = " listView " runat = " server " ClientIDMode = " Static " ClientIDRowSuffix = " ProductId " >
             < ItemTemplate >
                 < div >
                     < asp:Label ID = " productPrice " ClientIDMode = " Predictable " runat = " server " >
                         < %# string .Format(System.Globalization.CultureInfo.CurrentUICulture, " {0:c} " , Eval ( " ProductPrice " ))% >
                     </ asp:Label >
                 </ div >
             </ ItemTemplate >
             < LayoutTemplate >
                 < div id = " listViewContainer " >
                     < div id = " itemPlaceholder " runat = " server " />
                 </ div >
             </ LayoutTemplate >
         </ asp:ListView >
         < asp:TextBox ID = " txtPredictableListView " runat = " server " TextMode = " MultiLine " Rows = " 10 "
            ClientIDMode = " Static " Style = " width: 99%; " />
     </ fieldset >

     < script type = " text/javascript " >

        window.onload = function () {
            document.getElementById( ' <%= txtLegacy.ClientID %>').value += "   ClientID: " + '<%= txtLegacy.ClientID %>';

            document.getElementById( ' <%= txtStatic.ClientID %>').value += "   ClientID: " + '<%= txtStatic.ClientID %>';

            document.getElementById( ' <%= txtInherit.ClientID %>').value += "   ClientID: " + '<%= txtInherit.ClientID %>';

            document.getElementById( ' txtPredictableRepeater').value = document.getElementById('repeaterContainer').innerHTML;

            document.getElementById( ' txtPredictableListView').value = document.getElementById('listViewContainer').innerHTML;
        }

     </ script >
</ asp:Content >

 

　　ClientID.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace AspDotNet
{
     public partial class ClientID : System.Web.UI.Page
    {
        protected void Page_Load( object sender, EventArgs e)
        {
            BindData();
        }

         // 绑定数据到 ListView
         private void BindData()
        {
            Random random = new Random();

            List < Product > products = new List < Product > ();
             for ( int i = 0 ; i < 5 ; i ++ )
            {
                products.Add( new Product { ProductId = i + 100 , ProductName = " 名称 " , ProductPrice = random.NextDouble() });
            }

            listView.DataSource = products;
            listView.DataBind();

            repeater.DataSource = products;
            repeater.DataBind();
        }

        class Product
        {
             public int ProductId { get ; set ; }
             public string ProductName { get ; set ; }
             public double ProductPrice { get ; set ; }
        }
    }
}

 　

 

　　4、EnablePersistedSelection 属性的用法

　　EnablePersistedSelection.aspx

< %@ Page Title = "" Language = " C# " MasterPageFile = " ~/Site.Master " AutoEventWireup = " true "
    CodeBehind = " EnablePersistedSelection.aspx.cs " Inherits = " AspDotNet.EnablePersistedSelection " % >

< asp:Content ID = " Content1 " ContentPlaceHolderID = " head " runat = " server " >
</ asp:Content >
< asp:Content ID = " Content2 " ContentPlaceHolderID = " ContentPlaceHolder1 " runat = " server " >
     < ! --
        EnablePersistedSelection - 保存选中项的方式
             true - 根据 DataKeyNames 指定的字段做为关键字保存选中项（分页操作不会改变选中项）
             false - 根据行在当前页的表中的索引做为关键字保存选中项（分页后，选中项会发生改变。比如，在第一页选中了第一行，那么分页到第二页的时候选此页的第一行就会被当成选中项，也就是选中项发生了改变）
     -->

     < asp:GridView ID = " gridView " runat = " server " AllowPaging = " True " DataSourceID = " ObjectDataSource1 "
        CellPadding = " 4 " ForeColor = " #333333 " GridLines = " None " EnablePersistedSelection = " true "
        DataKeyNames = " productId " >
         < AlternatingRowStyle BackColor = " White " />
         < Columns >
             < asp:CommandField ShowSelectButton = " True " />
             < asp:BoundField DataField = " productId " HeaderText = " productId " SortExpression = " productId " />
             < asp:BoundField DataField = " productName " HeaderText = " productName " SortExpression = " productName " />
             < asp:BoundField DataField = " productPrice " HeaderText = " productPrice " SortExpression = " productPrice " />
         </ Columns >
         < FooterStyle BackColor = " #990000 " Font - Bold = " True " ForeColor = " White " />
         < HeaderStyle BackColor = " #990000 " Font - Bold = " True " ForeColor = " White " />
         < PagerStyle BackColor = " #FFCC66 " ForeColor = " #333333 " HorizontalAlign = " Center " />
         < RowStyle BackColor = " #FFFBD6 " ForeColor = " #333333 " />
         < SelectedRowStyle BackColor = " #FFCC66 " Font - Bold = " True " ForeColor = " Navy " />
         < SortedAscendingCellStyle BackColor = " #FDF5AC " />
         < SortedAscendingHeaderStyle BackColor = " #4D0000 " />
         < SortedDescendingCellStyle BackColor = " #FCF6C0 " />
         < SortedDescendingHeaderStyle BackColor = " #820000 " />
     </ asp:GridView >
     < asp:ObjectDataSource ID = " ObjectDataSource1 " runat = " server " SelectMethod = " GetData "
         TypeName = " AspDotNet.EnablePersistedSelection " ></ asp:ObjectDataSource >

</ asp:Content >

 

　　EnablePersistedSelection.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace AspDotNet
{
     public partial class EnablePersistedSelection : System.Web.UI.Page
    {
        protected void Page_Load( object sender, EventArgs e)
        {
            
        }

         // 为 GridView 提供数据
         public List < Product > GetData()
        {
            Random random = new Random();

            List < Product > products = new List < Product > ();
             for ( int i = 0 ; i < 100 ; i ++ )
            {
                products.Add( new Product { ProductId = i + 1 , ProductName = " 名称 " , ProductPrice = random.NextDouble() });
            }

            return products;
        }
    }

     // 为 GridView 提供数据的实体类
     public class Product
    {
         public int ProductId { get ; set ; }
         public string ProductName { get ; set ; }
         public double ProductPrice { get ; set ; }
    }
}

 　

 

　　5、控件的其他一些增强点

　　ControlsEnhancement.aspx

< %@ Page Title = "" Language = " C# " MasterPageFile = " ~/Site.Master " AutoEventWireup = " true "
    CodeBehind = " ControlsEnhancement.aspx.cs " Inherits = " AspDotNet.ControlsEnhancement " % >

< asp:Content ID = " Content1 " ContentPlaceHolderID = " head " runat = " server " >
</ asp:Content >
< asp:Content ID = " Content2 " ContentPlaceHolderID = " ContentPlaceHolder1 " runat = " server " >

     < ! --
        RenderOuterTable - 指定控件在客户端呈现的时候，是否在外层加 table 标签
            FormView，Login，PasswordRecovery，ChangePassword 控件均有此属性
     -->
     < asp:FormView ID = " FormView1 " runat = " server " DefaultMode = " Insert " RenderOuterTable = " false " >
         < InsertItemTemplate >
            FormView 的插入模板
         </ InsertItemTemplate >
     </ asp:FormView >

     < br />< br />

     < ! --
        Menu 控件，在 asp.net 4.0 中将会以 ul li 的方式呈现在客户端
     -->
     < asp:Menu ID = " Menu1 " runat = " server " >
         < Items >
             < asp:MenuItem Text = " Level 1 - Item 1 " Value = " 1 " >
                 < asp:MenuItem Text = " New Item " Value = " 3 " ></ asp:MenuItem >
             </ asp:MenuItem >
             < asp:MenuItem Text = " Level 1 - Item 2 " Value = " 2 " >
                 < asp:MenuItem Text = " Level 2 - Item 1 " Value = " 4 " ></ asp:MenuItem >
                 < asp:MenuItem Text = " Level 2 - Item 2 " Value = " 5 " ></ asp:MenuItem >
             </ asp:MenuItem >
         </ Items >
     </ asp:Menu >

     < br />< br />

     < ! --
        RepeatLayout - 布局模式，控件在客户端的 HTML 呈现方式
            RepeatLayout.Flow - 流式布局，一行一个选项
            RepeatLayout.OrderedList - ol li 布局
            RepeatLayout.UnorderedList - ul li 布局
            RepeatLayout.Table - Table 布局
            CheckBoxList，RadioButton 控件均有此属性
     -->
     < asp:CheckBoxList ID = " CheckBoxList1 " runat = " server " RepeatLayout = " UnorderedList " >
         < asp:ListItem Text = " Item1 " />
         < asp:ListItem Text = " Item2 " />
         < asp:ListItem Text = " Item3 " />
         < asp:ListItem Text = " Item4 " />
         < asp:ListItem Text = " Item5 " />
         < asp:ListItem Text = " Item6 " />
     </ asp:CheckBoxList >

     < br />< br />

     < ! --
        Wizard 和 CreateUserWizard 新增了 LayoutTemplate 模板 ，如下
            headerPlaceholder - runtime时，其内容会被 HeaderTemplate 中的内容替换掉
            sideBarPlaceholder - runtime时，其内容会被 SideBarTemplate 中的内容替换掉
            wizardStepPlaceholder - runtime时，其内容会被 WizardStepTemplate 中的内容替换掉
            navigationPlaceholder - runtime时，其内容会被导航模板中的内容替换掉
     -->
     < asp:Wizard ID = " Wizard1 " runat = " server " >
         < LayoutTemplate >
             < div style = " background-color: Yellow " >
                 < asp:PlaceHolder ID = " headerPlaceholder " runat = " server " />
             </ div >
             < asp:PlaceHolder ID = " sideBarPlaceholder " runat = " server " />
             < asp:PlaceHolder ID = " wizardStepPlaceholder " runat = " server " />
             < div style = " background-color: Red " >
                 < asp:PlaceHolder ID = " navigationPlaceholder " runat = " server " />
             </ div >
         </ LayoutTemplate >
         < HeaderTemplate >
            Header
         </ HeaderTemplate >
         < WizardSteps >
             < asp:WizardStep runat = " server " Title = " Step 1 " >
             </ asp:WizardStep >
             < asp:WizardStep runat = " server " Title = " Step 2 " >
             </ asp:WizardStep >
         </ WizardSteps >
     </ asp:Wizard >

     < br />< br />

     < ! --
        原来使用 ListView 必须要有 LayoutTemplate ，在 asp.net 4.0 中可以不再用它了
     -->
     < asp:ListView ID = " listView " runat = " server " ClientIDRowSuffix = " ProductId " >
         < ItemTemplate >
             < div style = " background-color: Fuchsia " >
                 < %# string .Format(System.Globalization.CultureInfo.CurrentUICulture, " {0:c} " , Eval ( " ProductPrice " ))% >
             </ div >
         </ ItemTemplate >
         < % --
         < LayoutTemplate >
             < div style = " background-color: Fuchsia " >
                 < div id = " itemPlaceholder " runat = " server " />
             </ div >
         </ LayoutTemplate >
         -- % >
     </ asp:ListView >

</ asp:Content >

 

　　ControlsEnhancement.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace AspDotNet
{
     public partial class ControlsEnhancement : System.Web.UI.Page
    {
        protected void Page_Load( object sender, EventArgs e)
        {
            BindData();
        }

         // 绑定数据到 ListView
         private void BindData()
        {
            Random random = new Random();

            List < Product > products = new List < Product > ();
             for ( int i = 0 ; i < 5 ; i ++ )
            {
                products.Add( new Product { ProductId = i + 1 , ProductName = " 名称 " , ProductPrice = random.NextDouble() });
            }

            listView.DataSource = products;
            listView.DataBind();
        }

        class Product
        {
             public int ProductId { get ; set ; }
             public string ProductName { get ; set ; }
             public double ProductPrice { get ; set ; }
        }
    }
}

        OK !