Overview

EO.Web MultiPage offers highly flexible multi-view functionality. The control supports complete server-side & client-side object models that allow you to switch the active page either on the server side or on the client side. It can be used with other navigation controls such as Menu, SlideMenu, TabStrip and TreeView to create a multi-tab interface in a matter of seconds.

Using MultiPage on the server side

Using MultiPage client side interface

Using MultiPage with other EO.Web Navigation Controls

Using MultiPage on the server side

Simply drag an EO.Web MultiPage control onto your Web Form to create an instance of MultiPage control. MultiPage is a container control that contains any number of PageView control. PageView control is also a container control that can contain any other ASP.NET controls. The picture below shows a MultiPage control that contains three PageView controls:

As shown in the picture, each PageView control also contains other controls.

You can use the following methods and properties to navigate the current selected page:

EO.Web MultiPage control also supports automatic navigation based on CommandName. For example, you can add a "Next" button on your PageView control and sets its CommandName to the value of MultiPage.NextPageCommandName. When the button is clicked, the MultiPage control automatically navigates to the next page.

Using MultiPage client side interface

You can also change the current selected page on the client side through JavaScript. The following code snippet switches to the next page when the link is clicked:

<a href="javascript:eo_GetObject('MultiPage1').selectNext();" >Next</a>

For a complete reference of EO.Web MultiPage client side object, see here.

Using MultiPage with other EO.Web Controls

EO.Web MultiPage can be used together with EO.Web Menu, Slide Menu or TabStrip. To use EO.Web MultiPage with these controls, set the MultiPageID property to the ID of the MultiPage control, optionally, you can also set the PageViewID property to explicitly associate a NavigationItem with a PageView. When a navigation item is selected, the associated PageView is set to selected and displayed.

For a detailed walkthrough, see Creating a Tabbed Dialog.