四、MultiView 类
MultiView 控件是一组 View 控件的容器。使用它可定义一组 View 控件，其中每个 View 控件都包含子控件。然后，应用程序可根据用户标识、用户首选项以及在查询字符串参数中传递的信息等条件，向客户端呈现特定的 View 控件。也可以使用 MultiView 控件创建向导。这种情况下，MultiView 控件包含的每个 View 控件都表示向导中的不同步骤或页。此控件还可用来开发移动设备的多屏幕应用程序。此控件提供的功能与 .NET Framework 1.1 版的 ASP.NET Form 移动控件相同。
在 MultiView 控件中，一次只能将一个 View 控件定义为活动视图。如果某个 View 控件定义为活动视图，它所包含的子控件则会呈现到客户端。可以使用 ActiveViewIndex 属性或 SetActiveView 方法定义活动视图。如果 ActiveViewIndex 属性为空，则 MultiView 控件不向客户端呈现任何内容。如果活动视图设置为 MultiView 控件中不存在的 View，则会在运行时引发 ArgumentOutOfRangeException。
可以通过声明方式或编程方式定义活动视图。如果在定义 MultiView 控件时以声明方式设置 ActiveViewIndex 属性，则会使设置为活动视图的 View 控件在首次调用 MultiView 控件时呈现到客户端。下面的代码示例演示如何以声明方式设置 ActiveViewIndex 属性。
<asp:MultiView id="MultiView1" ActiveViewIndex=0 runat="Server">
如果以编程方式设置 ActiveViewIndex 属性，或调用 SetActiveView 方法，则应用程序可以在运行时根据用户标识或首选项等条件，确定向客户端呈现哪个 View 控件。
若要允许用户在 MultiView 控件中的 View 控件之间进行导航，可将 LinkButton 或 Button 控件添加到每个 View 控件。若要利用 MultiView 控件对当前活动 View 进行自动更新，请将按钮或链接按钮的 CommandName 属性设置为与所需导航行为对应的命令名字段的值，这些命令名字段如下：PreviousViewCommandName、NextViewCommandName、SwitchViewByIDCommandName 或 SwitchViewByIndexCommandName。
示例
1、下面的代码示例演示如何使用 MultiView 控件创建基本调查。每个 View 控件都是一个单独的调查问题。当用户单击任一页上的“上一页”按钮时，ActiveViewIndex 属性递减以导航到上一个 View 控件。当用户单击任一页上的“下一页”按钮时，ActiveViewIndex 属性递增以导航到下一个 View 控件。
说明： 下面的代码示例使用单文件代码模型；在将这些代码示例直接复制到代码隐藏文件中时，它们可能无法正常工作。此代码示例必须被复制到具有 .aspx 扩展名的空文本文件中。
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<title>MultiView ActiveViewIndex Example</title>
<script runat="server">
protected void NextButton_Command(object sender, EventArgs e)
{
// Determine which button was clicked
// and set the ActiveViewIndex property to
// the view selected by the user.
if (DevPollMultiView.ActiveViewIndex > -1 & DevPollMultiView.ActiveViewIndex < 3)
{
// Increment the ActiveViewIndex property
// by one to advance to the next view.
DevPollMultiView.ActiveViewIndex += 1;
}
else if (DevPollMultiView.ActiveViewIndex == 3)
{
// This is the final view.
// The user wants to save the survey results.
// Insert code here to save survey results.
// Disable the navigation buttons.
Page4Save.Enabled = false;
Page4Restart.Enabled = false;
}
else
{
throw new Exception("An error occurred.");
}
}
protected void BackButton_Command(object sender, EventArgs e)
{
if (DevPollMultiView.ActiveViewIndex > 0 & DevPollMultiView.ActiveViewIndex <= 2)
{
// Decrement the ActiveViewIndex property
// by one to return to the previous view.
DevPollMultiView.ActiveViewIndex -= 1;
}
else if (DevPollMultiView.ActiveViewIndex == 3)
{
// This is the final view.
// The user wants to restart the survey.
// Return to the first view.
DevPollMultiView.ActiveViewIndex = 0;
}
else
{
throw new Exception("An error occurred.");
}
}
</script>
</head>
<body>
<form id="Form1" runat="Server">
<h3>MultiView ActiveViewIndex Example</h3>
<asp:Panel id="Page1ViewPanel"
Width="330px"
Height="150px"
HorizontalAlign="Left"
Font-size="12"
BackColor="#C0C0FF"
BorderColor="#404040"
BorderStyle="Double"
runat="Server">
<asp:MultiView id="DevPollMultiView"
ActiveViewIndex="0"
runat="Server">
<asp:View id="Page1"
runat="Server">
<asp:Label id="Page1Label"
Font-bold="true"
Text="What kind of applications do you develop?"
runat="Server"
AssociatedControlID="Page1">
</asp:Label><br /><br />
<asp:RadioButton id="Page1Radio1"
Text="Web Applications"
Checked="False"
GroupName="RadioGroup1"
runat="server" >
</asp:RadioButton><br />
<asp:RadioButton id="Page1Radio2"
Text="Windows Forms Applications"
Checked="False"
GroupName="RadioGroup1"
runat="server" >
</asp:RadioButton><br /><br /><br />
<asp:Button id="Page1Next"
Text = "Next"
OnClick="NextButton_Command"
Height="25"
Width="70"
runat= "Server">
</asp:Button>
</asp:View>
<asp:View id="Page2"
runat="Server">
<asp:Label id="Page2Label"
Font-bold="true"
Text="How long have you been a developer?"
runat="Server"
AssociatedControlID="Page2">
</asp:Label><br /><br />
<asp:RadioButton id="Page2Radio1"
Text="Less than five years"
Checked="False"
GroupName="RadioGroup1"
runat="Server">
</asp:RadioButton><br />
<asp:RadioButton id="Page2Radio2"
Text="More than five years"
Checked="False"
GroupName="RadioGroup1"
runat="Server">
</asp:RadioButton><br /><br /><br />
<asp:Button id="Page2Back"
Text = "Previous"
OnClick="BackButton_Command"
Height="25"
Width="70"
runat= "Server">
</asp:Button>
<asp:Button id="Page2Next"
Text = "Next"
OnClick="NextButton_Command"
Height="25"
Width="70"
runat="Server">
</asp:Button>
</asp:View>
<asp:View id="Page3"
runat="Server">
<asp:Label id="Page3Label1"
Font-bold="true"
Text= "What is your primary programming language?"
runat="Server"
AssociatedControlID="Page3">
</asp:Label><br /><br />
<asp:RadioButton id="Page3Radio1"
Text="Visual Basic .NET"
Checked="False"
GroupName="RadioGroup1"
runat="Server">
</asp:RadioButton><br />
<asp:RadioButton id="Page3Radio2"
Text="C#"
Checked="False"
GroupName="RadioGroup1"
runat="Server">
</asp:RadioButton><br />
<asp:RadioButton id="Page3Radio3"
Text="C++"
Checked="False"
GroupName="RadioGroup1"
runat="Server">
</asp:RadioButton><br /><br />
<asp:Button id="Page3Back"
Text = "Previous"
OnClick="BackButton_Command"
Height="25"
Width="70"
runat="Server">
</asp:Button>
<asp:Button id="Page3Next"
Text = "Next"
OnClick="NextButton_Command"
Height="25"
Width="70"
runat="Server">
</asp:Button><br />
</asp:View>
<asp:View id="Page4"
runat="Server">
<asp:Label id="Label1"
Font-bold="true"
Text = "Thank you for taking the survey."
runat="Server"
AssociatedControlID="Page4">
</asp:Label>
<br /><br /><br /><br /><br /><br />
<asp:Button id="Page4Save"
Text = "Save Responses"
OnClick="NextButton_Command"
Height="25"
Width="110"
runat="Server">
</asp:Button>
<asp:Button id="Page4Restart"
Text = "Retake Survey"
OnClick="BackButton_Command"
Height="25"
Width="110"
runat= "Server">
</asp:Button>
</asp:View>
</asp:MultiView>
</asp:Panel>
</form>
</body>
</html>
2、下面的代码示例演示如何创建包含三个 View 控件的基本 MultiView 控件。用户从列表框中选择的视图被设置为活动视图并向用户显示。有关 MultiView 控件的更详细示例，请参见本主题中提供的其他代码示例。
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<title>MultiView Class Example</title>
<script runat="server">
Sub Index_Changed(ByVal Sender As Object, ByVal e As EventArgs)
' Set the active view to
' the view selected by the user.
Dim text As String = ViewListBox.SelectedItem.Text
Select Case (text)
Case "View1"
MultiView1.SetActiveView(View1)
Case "View2"
MultiView1.SetActiveView(View2)
Case "View3"
MultiView1.SetActiveView(View3)
Case Else
Throw New Exception("You did not select a valid view.")
End Select
End Sub
</script>
</head>
<body>
<form id="Form1" runat="server">
<h3>MultiView Class Example</h3>
<h4>Select a View to display in a MultiView control:</h4>
<asp:ListBox id="ViewListBox"
Rows="1"
SelectionMode="Single"
AutoPostBack="True"
OnselectedIndexChanged="Index_Changed"
runat="Server">
<asp:ListItem Value="0">View1</asp:ListItem>
<asp:ListItem Value="1">View2</asp:ListItem>
<asp:ListItem Value="2">View3</asp:ListItem>
</asp:ListBox><br /><br />
<hr />
<asp:MultiView id="MultiView1"
runat="Server">
<asp:View id="View1"
runat="Server">
<asp:Label id="View1Label"
Font-bold="true"
Font-size="14"
Text="This is the content for View1."
runat="Server"
AssociatedControlID="View1">
</asp:Label>
</asp:View>
<asp:View id="View2"
runat="Server">
<asp:Label id="View2Label"
Font-bold="true"
Font-size="14"
Text="This is the content for View2."
runat="Server"
AssociatedControlID="View2">
</asp:Label>
</asp:View>
<asp:View id="View3"
runat="Server">
<asp:Label id="View3Label"
Font-bold="true"
Font-size="14"
Text="This is the content for View3."
runat="Server"
AssociatedControlID="View3">
</asp:Label>
</asp:View>
</asp:MultiView>
</form>
</body>
</html>
3、下面的代码示例演示如何创建包含三个 View 控件的 MultiView 控件。View 控件没有任何样式属性。因此，每个 View 控件都包含一个 Panel 控件以便设置 View 控件的样式。首次加载页时，通过使用 SetActiveView 方法，将 DefaultView 设置为活动视图。每个 View 控件都包含链接按钮以便用户导航到其他视图。
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<title>MultiView Class Example</title>
<script runat="server">
Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
' The first time the page loads,
' render the DefaultView.
If Not IsPostBack Then
' Set DefaultView as the active view.
MultiView1.SetActiveView(DefaultView)
End If
End Sub
Sub LinkButton_Command(sender As Object, e As System.Web.UI.WebControls.CommandEventArgs)
' Determine which link button was clicked
' and set the active view to
' the view selected by the user.
Select Case (e.CommandArgument)
Case "DefaultView"
MultiView1.SetActiveView(DefaultView)
Case "News"
MultiView1.SetActiveView(NewsView)
Case "Shopping"
MultiView1.SetActiveView(ShoppingView)
Case Else
Throw New Exception("You did not select a valid list item.")
End Select
End Sub
</script>
</head>
<body>
<form id="Form1" runat="server">
<h3>MultiView Class Example</h3>
<asp:MultiView id="MultiView1"
runat="Server">
<asp:View id="DefaultView"
runat="Server">
<asp:Panel id="DefaultViewPanel"
Width="330px"
BackColor="#C0C0FF"
BorderColor="#404040"
BorderStyle="Double"
runat="Server">
<asp:Label id="DefaultLabel1"
Font-bold="true"
Font-size="14"
Text="The Default View"
runat="Server"
AssociatedControlID="DefaultView">
</asp:Label>
<asp:BulletedList id="DefaultBulletedList1"
BulletStyle="Disc"
DisplayMode="Hyperlink"
Target="_blank"
runat="Server">
<asp:ListItem Value="http://www.microsoft.com">Today's Weather</asp:ListItem>
<asp:ListItem Value="http://www.microsoft.com">Today's Stock Quotes</asp:ListItem>
<asp:ListItem Value="http://www.microsoft.com">Today's News Headlines</asp:ListItem>
<asp:ListItem Value="http://www.microsoft.com">Today's Featured Shopping</asp:ListItem>
</asp:BulletedList>
<hr />
<asp:Label id="DefaultLabel2"
Font-size="12"
Text="Click a link to display a different view:"
runat="Server">
</asp:Label><br />
<asp:LinkButton id="Default_NewsLink"
Text="Go to News View"
OnCommand="LinkButton_Command"
CommandArgument="News"
CommandName="Link"
Width="150px"
runat="Server">
</asp:LinkButton>
<asp:LinkButton id="Default_ShoppingLink"
Text="Go to Shopping View"
OnCommand="LinkButton_Command"
CommandArgument="Shopping"
CommandName="Link"
Width="150px"
runat="server">
</asp:LinkButton><br /><br />
</asp:Panel>
</asp:View>
<asp:View id="NewsView"
runat="Server">
<asp:Panel id="NewsPanel1"
Width="330px"
BackColor="#C0FFC0"
BorderColor="#404040"
BorderStyle="Double"
runat="Server">
<asp:Label id="NewsLabel1"
Font-bold="true"
Font-size="14"
Text="The News View"
runat="Server"
AssociatedControlID="NewsView">
</asp:Label>
<asp:BulletedList id="NewsBulletedlist1"
BulletStyle="Disc"
DisplayMode="Hyperlink"
Target="_blank"
runat="Server">
<asp:ListItem Value="http://www.microsoft.com">Today's International Headlines</asp:ListItem>
<asp:ListItem Value="http://www.microsoft.com">Today's National Headlines</asp:ListItem>
<asp:ListItem Value="http://www.microsoft.com">Today's Local News</asp:ListItem>
</asp:BulletedList>
<hr />
<asp:Label id="NewsLabel2"
Font-size="12"
Text="Click a link to display a different view:"
runat="Server">
</asp:Label><br />
<asp:LinkButton id="News_DefaultLink"
Text="Go to the Default View"
OnCommand="LinkButton_Command"
CommandArgument="DefaultView"
CommandName="Link"
Width="150px"
runat="Server">
</asp:LinkButton>
<asp:LinkButton id="News_ShoppingLink"
Text="Go to Shopping View"
OnCommand="LinkButton_Command"
CommandArgument="Shopping"
CommandName="Link"
Width="150px"
runat="Server">
</asp:LinkButton><br /><br />
</asp:Panel>
</asp:View>
<asp:View id="ShoppingView"
runat="Server">
<asp:Panel id="ShoppingPanel1"
Width="330px"
BackColor="#FFFFC0"
BorderColor="#404040"
BorderStyle="Double"
runat="Server">
<asp:Label id="ShoppingLabel1"
Font-Bold="true"
Font-size="14"
Text="The Shopping View"
runat="Server"
AssociatedControlID="ShoppingView">
</asp:Label>
<asp:BulletedList id="ShoppingBulletedlist1"
BulletStyle="Disc"
DisplayMode="Hyperlink"
Target="_blank"
runat="Server">
<asp:ListItem Value="http://www.microsoft.com">Shop for Home and Garden </asp:ListItem>
<asp:ListItem Value="http://www.microsoft.com">Shop for Women's Fashions</asp:ListItem>
<asp:ListItem Value="http://www.microsoft.com">Shop for Men's Fashions</asp:ListItem>
</asp:BulletedList>
<hr />
<asp:Label id="ShoppingLabel2"
Font-size="12"
Text="Click a link to display a different view:"
runat="Server">
</asp:Label><br />
<asp:LinkButton id="Shopping_DefaultLink"
Text="Go to the Default View"
OnCommand="LinkButton_Command"
CommandArgument="DefaultView"
CommandName="Link"
Width="150px"
runat="Server">
</asp:LinkButton>
<asp:LinkButton id="Shopping_NewsLink"
Text="Go to News View"
OnCommand="LinkButton_Command"
CommandArgument="News"
CommandName="Link"
Width="150px"
runat="Server">
</asp:LinkButton><br /><br />
</asp:Panel>
</asp:View>
</asp:MultiView>
</form>
</body>
</html>
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
