Subscribe

RSS Feed (xml)

Using the TabControl and PageView IE Web Controls

The first step is to install the IE Web Controls from Microsoft.The link to download and
install these controls is as follows: http://msdn.microsoft.com/downloads/samples/
internet/default.asp?url=/downloads/samples/internet/asp_dot_net_
servercontrols/webcontrols/default.asp


Next, you need to add a reference to the Web Controls on your page:
<%@ Register TagPrefix=”ieControls”
Namespace=”Microsoft.Web.UI.WebControls”
Assembly=”Microsoft.Web.UI.WebControls” %>
<%@ import namespace=”Microsoft.Web.UI.WebControls” %>
Then you add your tabstrip.This is the control that generates the tabs that users click to
change pages:
<IECONTROLS:TABSTRIP id=”myTabStrip” runat=”server” TargetID=”myMultiPage”
Orientation=”Vertical”>
<IECONTROLS:Tab Text=”Tab 1”></IECONTROLS:Tab>
<IECONTROLS:TabSeparator></IECONTROLS:TabSeparator>
<IECONTROLS:Tab Text=”Tab 2”></IECONTROLS:Tab>
<IECONTROLS:TabSeparator DefaultStyle=”height:100%;”>
</IECONTROLS:TabSeparator>
</IECONTROLS:TABSTRIP>
Lastly, you need to add your multipage control that contains the different pages that will
be viewed when users select each tab:
<IECONTROLS:MULTIPAGE id=”myMultiPage” runat=”server”>
<IECONTROLS:PAGEVIEW>
Page 1
</IECONTROLS:PAGEVIEW>
<IECONTROLS:PAGEVIEW>
Page 2
</IECONTROLS:PAGEVIEW>
</IECONTROLS:MULTIPAGE>

Notice that there is a property on the tabstrip control called TargetID.This must be set
to the ID of the multipage control that will be working with the tabstrip.When the
users click on the tab, the tabstrip will then tell the PageView to show the corresponding
page.When working with the multipage control, you can add any type of ASP.NET
or HTML between the opening and closing PageView tags. In this example, the tabstrip
is running vertically, but you can also set this value to horizontal.To do so, you simply
need to set the Orientation property to horizontal.

No comments:

Archives

Variety in the Web World