ASP.NET 用MultiView和View实现选项卡效果

MultiView 和 View Web 服务器控件用作其他控件和标记的容器，并提供了一种可方便地显示信息的替换视图的方式。可以使用 MultiView 和 View 控件执行如下任务：
根据用户选择或其他条件提供备选控件集。
创建多页窗体。
MultiView 和 View 结构
MultiView 控件用作一个或多个 View 控件的外部容器。View 控件又可包含标记和控件的任何组合。MultiView 控件一次显示一个 View 控件，并公开该 View 控件内的标记和控件。通过设置 MultiView 控件的 ActiveViewIndex 属性，可以指定当前可见的 View 控件。 

呈现 View 控件内容
未选择某个 View 控件时，该控件不会呈现到页面中。但是，每次呈现页面时都会创建所有 View 控件中的所有 Web 服务器控件的实例，并且将这些实例的值存储为页面的视图状态的一部分。无论是 MultiView 控件还是各个 View 控件，除当前 View 控件的内容外，都不会在页面中显示任何标记。引用控件每个 View 控件都支持 Controls 属性，该属性包含该 View 控件中的控件集合。但是，可以在代码中单独引用 View 控件中的控件。

在视图间导航
通过将 MultiView 控件的 ActiveViewIndex 属性设置为要显示的 View 控件的索引值，可以在视图间移动。MultiView 控件还支持可以添加到每个 View 控件的导航按钮。若要创建导航按钮，可以向每个 View 控件添加一个按钮控件（Button、LinkButton 或 ImageButton）。然后可以将每个按钮的 CommandName 和 CommandArgument 属性设置为保留值以使 MultiView 控件移动到另一个视图。

mulitiview控件，它类似于VB中的tabcontrol控件。它在页面中，可以放置多个“view”（也就是选项卡），可以实现让用户在同一页面中，通过切换到每个选项卡，从而看到要看的内容，而不用每次都重新打开一个新的。
mulitiview主要是通过ActiveViewIndex属性设置为要显示View控件的索引值，可以在视图间移动。mulitiview控件还支持可以添加到每个View控件的导航按钮。
要创建导航按钮，可以向每个view控件添加一个按钮控件（Button、LinkButton、ImageButton）。然后可以将每个按钮的CommandName和CommandArgument属性设置为保留值以使Mutiview控件移动到另一个视图。
下表列出了保留的CommandName值和相应的CommandArgument值。
 
下面将一个应用的例子，前台设计演示：
 
上图控件的前台代码是：
 
[html] view plain copy
 print?
<div>  
    <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True"   
        onselectedindexchanged="DropDownList1_SelectedIndexChanged" Height="16px"   
        Width="72px">  
        <asp:ListItem Value="0">1</asp:ListItem>  
        <asp:ListItem Value="1">2</asp:ListItem>  
        <asp:ListItem Value="2">3</asp:ListItem>  
        <asp:ListItem Value="3">4</asp:ListItem>  
    </asp:DropDownList>  
  
    <asp:MultiView ID="MultiView1" runat="server">  
        <asp:View ID="View1" runat="server">  
        111111111111111111111<br />  
         <asp:Button ID="Button1" runat="server" Text="切换到第二个视图" CommandName="SwitchViewByID"   
        onclick="Button1_Click" CommandArgument="View2" />  
    <asp:Button ID="Button2" runat="server" Text="切换到下一个视图" CommandName="NextView"   
        onclick="Button2_Click" />  
        </asp:View>  
  
    <asp:View ID="View2" runat="server">  
  
    222222222222222222222<br />  
p;<asp:Button ID="Button3" runat="server" Text="切换到第三个视图" CommandArgument="View3" CommandName="SwitchViewByID" />  
    <asp:Button ID="Button4" runat="server" Text="切换到下一个视图" CommandName="NextView" />  
    </asp:View>  
  
    <asp:View ID="View3" runat="server">  
  
    333333333333333333333  
    <br />  
    <asp:Button ID="Button5" runat="server" Text="切换到第四个视图" CommandArgument="View4" CommandName="SwitchViewByID" />  
    <asp:Button ID="Button6" runat="server" Text="切换到下一个视图" CommandName="NextView" />  
    </asp:View>  
  
    <asp:View ID="View4" runat="server">  
  
    444444444444444444444  
  
    </asp:View>   
     </asp:MultiView>  
</div>  
 
后台代码演示：
 
[csharp] view plain copy
 print?
/// <summary>  
/// multiview 控件和view控件  
/// </summary>  
/// <param name="sender"></param>  
/// <param name="e"></param>  
protected void Page_Load(object sender, EventArgs e)  
{  
    if (Request.QueryString["id"]!=null )  
    {  
        MultiView1.ActiveViewIndex = Convert.ToInt32(Request.QueryString["id"]);  
    }  
}  
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)  
{//设置当前被显示的控件为下拉列表被选中的值  
    MultiView1.ActiveViewIndex = Convert.ToInt32(DropDownList1.SelectedValue);  
}  
效果演示：
当你点击相应的按钮，会跳到相应的视图。