Home/Tabbed Views

Tabbed view is a viewing strategy which enables users to have a number of interface components displayed on the same browser window. Each component generates a tab and can be selected either by the user or via its code. Try out the experiments shown below by operating the form. Use the experiment selector (bar) to test for yourself how tabbed views work.

Standard Master Detail Customized tabs Invisible tabs Page change

Initialize framework...

Standard master-detail: pick an order from the list then select the order detail tab. As you can see, switching from one tab to the next is quick and the related panel is filled with the selected order data in an instant. This speed is possible because the order is actually read only when the detail tab is selected, resulting in a lower number of queries executed. Click here to go to the next experiment.

Customized tabs: the style of some tab headings can be modified in order to highlight sets of different tabs. Click here to add two new windows with a different style to the tabbed view, otherwise click here to go to the next experiment.

Invisible tabs: tabs are not displayed in this type of view, so users cannot select the active tab. The active tab can be selected via its code. Click here to watch an example of a view with invisible tabs otherwise click here to go to the next experiment.

Page change: the page-change event is transferred to the form by its related tabbed view. Click here to activate the online example event then try to change page.