Tab n MultiView Control In Asp.Net

Feb 19, 2019 BY xtreme

INTRODUCED IN ASP.NET 2.0

The New MultiView control works in tandem with an embedded View Control.

Each View Control acts as a content container and behaves very much like a Panel or Canvas Area. At run time, the MultiView control manages the view controls to ensure only one View is visible at a time. 


<asp:UpdatePanel ID="updatepanel" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true" RenderMode="Inline">
	<ContentTemplate> 
		<div class="row">                           

			<div class="tabStyle clearfix">
				 <asp:Menu ID="Menu1″ Orientation="Horizontal" StaticMenuItemStyle-CssClass="tab"
					StaticSelectedStyle-CssClass="active" CssClass="tabs" runat="server" 
					OnMenuItemClick="Menu1_MenuItemClick" RenderingMode="List">
					
					<Items>
						<asp:MenuItem Text="Tab1″ Value="0″ Selected="true" />
						<asp:MenuItem Text="Tab2″ Value="1″ />
						<asp:MenuItem Text="Tab3″ Value="2″ />  
					</Items>

					<StaticMenuItemStyle CssClass="tab"></StaticMenuItemStyle>
					<StaticSelectedStyle CssClass="active"></StaticSelectedStyle>
				</asp:Menu>
			</div>                              

			
			<asp:MultiView ID="MultiView1″ runat="server" ActiveViewIndex="0″>
			
				<asp:View ID="View1″ runat="server" EnableTheming="False">
					<div class="row">
						<asp:TextBox ID="TextBox1″ runat="server" Visible="false" class="form-control"></asp:TextBox>  
					</div>
				</asp:View>

				<asp:View ID="View2″ runat="server" EnableTheming="False">
					<div class="row">
						<asp:TextBox ID="TextBox2″ runat="server" Visible="false" class="form-control"></asp:TextBox>
					</div>
				</asp:View>

				<asp:View ID="View3″ runat="server" EnableTheming="False">
					<div class="row">
						<asp:TextBox ID="TextBox3″ runat="server" Visible="false" class="form-control"></asp:TextBox>
					</div>
				</asp:View> 
				
			</asp:MultiView>
		</div>
	</ContentTemplate>

	<Triggers>
		<asp:AsyncPostBackTrigger ControlID="btnsubmit" EventName="Click" />  
	</Triggers>
</asp:UpdatePanel>

<div class="box-footer">
	<asp:Button ID="btnsubmit" runat="server" Text="Submit" OnClick="btnsubmit_Click" /> 
</div>


Related