Multiview control is an asp.net server control. It contains one or more views inside multiview control, Views contain all child control which is used to display in user interface.

Views of the multiview control are used to display user interface into groups.

Consider an example Multiview control inside contain two view controls

View1 for Add Registration form

View2 for Display Message for Thank you for Registration.

Step1: Drag Multiview control from standard controls

<asp:MultiView ID=”MultiView1″ runat=”server”>

</asp:MultiView>

Step2: Click inside Multiview control then Drag two view controls from Standard

Controls (View1 and View2)

Note: some times when you drag view control it show error that means you have to click mouse in multiview control then drag view control.

Sample code for Multiview and view controls

<asp:MultiView ID=”MultiView1″ runat=”server”>

<asp:View ID=”View1″ runat=”server”></asp:View>

<asp:View ID=”View2″ runat=”server”></asp:View>

</asp:MultiView>

View1 for Add Registration Form

View2 for Message (Thank you for Registration)

Step 3:

View1 contain four labels and four textboxes, one button control

Sample design code copy this code in view1

<asp:View ID=”View1″ runat=”server” >

<table   style=”border: 1px solid #C6F1FF; font-family: Verdana; font-size: 9pt”  width=”500px”>

<tr>

<td bgcolor=”#D5F7FF” class=”style2″ colspan=”2″>

Registration Form</td>

</tr>

<tr>

<td class=”style3″>

<asp:Label ID=”Label3″ runat=”server” Text=”FirstName”></asp:Label>

</td>

<td>

<asp:TextBox ID=”txtFirstName” runat=”server”></asp:TextBox>

</td>

</tr>

<tr>

<td class=”style3″>

<asp:Label ID=”Label4″ runat=”server” Text=”EmailID”></asp:Label>

</td>

<td>

<asp:TextBox ID=”TextBox2″ runat=”server”></asp:TextBox>

</td>

</tr>

<tr>

<td class=”style3″>

<asp:Label ID=”Label5″ runat=”server” Text=”UserName”></asp:Label>

</td>

<td>

<asp:TextBox ID=”TextBox3″ runat=”server”></asp:TextBox>

</td>

</tr>

<tr>

<td class=”style3″>

<asp:Label ID=”Label6″ runat=”server” Text=”Password”></asp:Label>

</td>

<td>

<asp:TextBox ID=”TextBox4″ runat=”server”></asp:TextBox>

</td>

</tr>

<tr>

<td class=”style3″>

&nbsp;</td>

<td>

<asp:Button ID=”btnRegister” runat=”server”

Text=”Register” onclick=”btnRegister_Click” />

<asp:Label ID=”Label7″ runat=”server” Font-Bold=”True” Font-Names=”Verdana” Font-Size=”9pt” ForeColor=”#CC3300″ Text=”(Multiview View From View1)”></asp:Label>

</td>

</tr>

</table>

</asp:View>

Step 4: Sample design code copy this code in view2

<asp:View ID=”View2″ runat=”server”>

<table width=”500px”>

<tr>

<td align=”center”>

<asp:Label ID=”lblMSg” runat=”server” Font-Bold=”True” Font-Names=”Verdana”  Font-Size=”9pt” Text=”Label” ForeColor=”#996633″></asp:Label>

<asp:Label ID=”Label8″ runat=”server” Font-Bold=”True” Font-Names=”Verdana”

Font-Size=”9pt” ForeColor=”#CC3300″ Text=”(Multiview View From View2)”></asp:Label>

</td>

</tr>

<tr>

<td align=”center”>

<asp:Button ID=”btnBack” runat=”server”  Text=”Back” onclick=”btnBack_Click” />

</td>

</tr>

</table>

</asp:View>

Step 5: Write Following code in Page_Load event to display required form view

I am going to display View1 in Page load begins in user interface

protected void Page_Load(object sender, EventArgs e)

{

MultiView1.SetActiveView(View1);

}

Run the application

Step 6: when you click register button (its ID is btnRegister)  it navigate to View2

and its FirstName (its ID is txtFirstName)  will transfer View2(Message)

View2 contain child controls label (its ID is lblMsg) and Button (its ID is btnBack)

Double click register button the following event fires

protected void btnRegister_Click(object sender, EventArgs e)

{

MultiView1.SetActiveView(View2);

lblMSg.Text = “Thank you for Registration ” + txtFirstName.Text;

}

Step 7: When you click Back button it will navigate to View1. The code is below

protected void btnBack_Click(object sender, EventArgs e)

{

MultiView1.SetActiveView(View1);

}