latest Post

MultiView & View Controls in Asp.Net

The MultiView & View Controls are new features of Asp.Net 2.0 which was introduced with Visual Studio 2005.
The MultiView and View Web server controls act as containers for other controls and markup, and provide a way for you to easily present alternate views of information. 
The MultiView and View controls were designed primarily for use with browsers on mobile devices, but they are supported in any ASP.NET page.

 You can use the MultiView and View controls to perform tasks such as the following:

  Provide alternate sets of controls based on user choice or other conditions. For example, you might allow users to select from a list of feeds, each of which is configured in a separate View control. You can then display the View control that contains the user's choice of feeds. You can use the MultiView and View controls as an alternative to creating multiple Panel controls.

  Create a multi-page form. The MultiView and View controls can provide behaviour that is similar to the Wizard control. The Wizard control is particularly suited to creating forms that users fill in step by step. The Wizard control also includes support for more built-in UI elements, such as a header and footer, for Previous and Next buttons, and for templates. 

You might use a MultiView control in place of a Wizard if you wanted to create a display that changed based on condition (rather than sequentially), or if you did not need the extra features supported by the Wizard control.  
The MultiView control acts as an outer container for one or more View controls. The View controls, in turn, can contain any combination of markup and controls. The MultiView control displays one View control at a time, exposing the markup and controls within that View control. By setting the MultiView control's ActiveViewIndex property, you can specify which View control is currently visible. 

OR 

MultiView and View controls allow you to divide the content of a page into different groups, displaying only one group at a time. Each View control manages one group of content and all the View controls are held together in a MultiView control. The MultiView control is responsible for displaying one View control at a time. The View displayed is called the active view.

 OR

 A View control works as a container of common controls and a MultiView control works as a container of several View controls.
 Rendering View Control Content: If a View control is not selected, it is not rendered to the page. However, instances of all Web server controls in all the View controls are created each time the page is rendered, and their values are stored as part of the page's view state.
Neither the MultiView control nor individual View controls render any markup to the page other than the contents of the current View control. For example, the controls do not render a div element in the same way that a Panel control does.
They also do not support appearance properties that can be applied as a whole to the current View control. But you can assign a theme to the MultiView or View controls, which applies the theme to all child controls of the current View control. 
Referencing Controls: Each View control supports a Controls property that contains a collection of the controls in that View control. You can also reference the controls in the View controls individually in code.
 Navigating Between Views: You can move between views by setting the MultiView control's ActiveViewIndex property to the index value of the View control to display.
The MultiView control also includes support for navigation buttons that you can add to each View control. To create navigation buttons, you can add a button control (Button, LinkButton, or ImageButton) to each View control.

 The syntax for a MultiView control is:
<asp:MultView ID= "MultiView1" runat= "server"></asp:MultiView> 


The syntax for a View control is:
<asp:View ID= "View1" runat= "server"></asp:View>
However, the View control cannot exist on its own. It would render error if you try to use it stand-alone. 

It is always used with a Multiview control as:
<asp:MultView ID= "MultiView1" runat= "server">
<asp:View ID= "View1" runat= "server"></asp:View>
</asp:MultiView>  



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MultiView_ViewControlsEx1.aspx.cs" Inherits="MultiView_ViewControlsEx1" %> 
<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml">

 <head runat="server"> 
    <title></title>
 </head> 
<body> 
 <form id="form1" runat="server"> 
        <div>    
         <h2>MultiView and View Controls</h2> 
            <hr />  
           <asp:MultiView ID="MultiView1"                 runat="server"                 ActiveViewIndex="0"> 
                <asp:View ID="View1" runat="server">
                     <h3>Image1:</h3>
                     <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/Ads1.jpg" Width="400" Height="400" /> 
                    <br />  
                   <asp:Button ID="btnNext1" runat="server" Text="Next Image" CommandName="NextView" />  
   <asp:Button runat="server" Text="Last Image" CommandName="SwitchViewByID" CommandArgument="View3" />
                 </asp:View> 
                <asp:View ID="View2" runat="server">
                     <h3>Image2:</h3> 
                    <asp:Image ID="Image2" runat="server" ImageUrl="~/Images/Ads2.jpg" Width="400" Height="400" /> 
                    <br /> 
                    <asp:Button ID="btnNext2"    runat="server" Text="Next Image" CommandName="NextView" />             
  <asp:Button ID="btnPrev2"      runat="server" Text="Previous Image" CommandName="PrevView" />  
               </asp:View>  
               <asp:View ID="View3" runat="server">  
                  <h3>Image3:</h3>
                     <asp:Image ID="Image3" runat="server" ImageUrl="~/Images/Ads3.jpg" Width="400" Height="400" />    
                 <br />       
              <asp:Button ID="btnFirst" runat="server" Text="First Image" CommandName="SwitchViewByIndex" CommandArgument="0" />   
                  &nbsp;    
                 <asp:Button ID="btnPrev3"  runat="server" Text="Previous Image" CommandName="PrevView" />  
               </asp:View>
             </asp:MultiView> 
       </div>
     </form>
 </body> 
</html>

About Mallikarjun A

Mallikarjun A
Recommended Posts × +

0 comments:

Post a Comment