asp.net 4.0 的新增功能
- 简洁的 web.config 文件
- 控件的新属性 ViewStateMode - 控件的视图状态模式
- 控件的新属性 ClientIDMode - 生成客户端 ID 的方式
- 列表控件的新属性 EnablePersistedSelection - 保存选中项的方式
- 控件的其他一些增强点
- 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
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
<?xml version="1.0"?>
<!--
清爽的 web.config
配置信息一律都放到 machine.config 里了
-->
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
</system.web>
</configuration>
<!--
清爽的 web.config
配置信息一律都放到 machine.config 里了
-->
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
</system.web>
</configuration>
2、ViewStateMode 属性的用法
ViewStateDemo.aspx
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
<%@ 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>
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
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
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";
}
}
}
}
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
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
<%@ 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=" 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=" 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>
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=" 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=" 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
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
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; }
}
}
}
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
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
<%@ 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>
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
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
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; }
}
}
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
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
<%@ 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>
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
![](https://images.cnblogs.com/OutliningIndicators/ExpandedBlockStart.gif)
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; }
}
}
}
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; }
}
}
}