Home > DeveloperSection > Articles > MultiView Control in ASP.Net

MultiView Control in ASP.Net


ASP.Net ASP.Net 
Ratings:
0 Comment(s)
 7438  View(s)
Rate this:

MultiView Control in ASP.Net

A View control works as a container of common controls and a MultiView control works as a container of several View controls.

<asp:MultiView ID="MultiView1" runat="server">

 

MultiView Control in ASP.Net

 

Here three LinkButton is used to show all these three view .When we click LinkButton one then view1 will be displayed and so on.

<asp:LinkButton ID="LinkButton1" runat="server" OnClick="LinkButton1_Click">Personal Information</asp:LinkButton>

           

<asp:LinkButton ID="LinkButton2" runat="server" OnClick="LinkButton2_Click">Contact info</asp:LinkButton>

           

<asp:LinkButton ID="LinkButton3" runat="server" OnClick="LinkButton3_Click">Image</asp:LinkButton>

 

 

<asp:MultiView ID="MultiView1" runat="server">

            <asp:View ID="view1" runat="server">

               

                Name

                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

               

                Id

                <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>

               

                Country

                <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>

            </asp:View>

            <asp:View ID="view2" runat="server">

               

                Mob.No.

             <asp:TextBox ID="TextBox4" runat="server"></asp:TextBox>

               

                Email Id

                <asp:TextBox ID="TextBox5" runat="server"></asp:TextBox>

            </asp:View>

            <asp:View ID="view3" runat="server">

               

            <asp:Image ID="Image1" runat="server" ImageUrl="~/grass2.jpg"  Width="121px" />

               

         <asp:Image ID="Image2" runat="server" Height="88px" ImageUrl="~/2609grass.jpg" Width="134px" />

            </asp:View>

 

  </asp:MultiView>

 

 

protected void LinkButton1_Click(object sender, EventArgs e)

    {

        MultiView1.ActiveViewIndex = 0;

    }

    protected void LinkButton2_Click(object sender, EventArgs e)

    {

        MultiView1.ActiveViewIndex = 1;

    }

    protected void LinkButton3_Click(object sender, EventArgs e)

    {

        MultiView1.ActiveViewIndex = 2;

    }

 

 

 

The View control has a TabIndex which sets the TabInxex of a View. The TabIndex is mapped with the ActiveViewIndex of MultiView control. When you set MultiView1.ActiveViewIndex = 0; then first view will be active.

When you  click LinkButton1 then  Personal Information View will be displayed in the page

MultiView Control in ASP.Net

 

 

When you click LinkButton2 then  contact Information View will be displayed in the page

MultiView Control in ASP.Net

When you  click LinkButton3 then  Image View will be displayed.

 

MultiView Control in ASP.Net


Don't want to miss updates? Please click the below button!

Follow MindStick