Controls You Can Use on Web Forms ASP.NET IE WebControls MultiPage WebControl
The MultiPage control, when used in conjunction with a TabStrip control, provides a very powerful and effective solution for organizing and presenting subsets of information without the need for complex coding.
The TabStrip class includes a TargetID attribute that, when set to the ID of the MultiPage control, enables automatic linking of Tab elements to the PageView elements of the associated MultiPage control.
The first Tab links to the first PageView; the second Tab to the second PageView, and so on. If there are more Tabs than PageViews, the Tabs with no corresponding PageViews can be activated, but the MultiPage will not change the selected PageView.
Let us briefly explore how that is done.
- Add the processing directives. See Adding MultiPage Controls to a Web Forms Page.
- Declare the <
ie:tabstrip
> element and optionally set the control’s base properties. Ensure that the value of the control’s TargetID property is set to the ID of the associated MultiPage control.
<ie:tabstrip id="tabstrip1" runat="server" targetid="multipage1" ... >
... individual tabs markup goes here ...
</ie:tabstrip>
- Add the Tab elements as child elements of the TabStrip.
<ie:tabstrip id="tabstrip1" runat="server" targetid="multipage1" ... >
<ie:tab text="Page 1" />
<ie:tab text="Page 2" />
</ie:tabstrip>
- Next, declare the MultiPage element and add PageView elements as child elements of the MultiPage in the same order as the Tab elements in the TabStrip. Ensure that the ID of the MultiPage corresponds to the value set for the TargetID of the TabStrip.
<ie:multipage id="multipage1" runat="server">
<ie:pageview id="page1">
... page1 content goes here ...
</ie:pageview>
<ie:pageview id="page2">
... page2 content goes here ...
</ie:pageview>
</ie:multipage>
The below examples show using a MultiPage with the TabStrip control, both of which are nested within a data control.
The TabStrip and MultiPage combo can even be further extended by nesting one TabStrip and MultiPage combo within another. To see this in action, view our sample Destination Guides application, and click on either the Divisions or Tourism tabs, each of which nests another set of tabs.
Nesting MultiPage Controls Using MultiPage Controls in a Templated Control