View Source

The Page Builder is a tool in AppBase for designing pages to use in your application. Using drag-and-drop and wizards, you can design complex pages and modify the page's markup if needed.

When entering the Page Builder, the page looks very similar to this:

AppBase 5.0 > Page Builder > image2013-3-13 14:33:58.png

Data Sources tab

AppBase 5.0 > Page Builder > image2013-5-8 16:58:43.png

The Data Source tab holds all the data sources that interact with your page. To add a data source, click on the arrow on the Add button. To edit a data source, select it and click on Settings in the Properties panel. Data Sources allow your page to interact with other data, like business objects and other pages.

Sections tab

AppBase 5.0 > Page Builder > image2013-5-8 17:51:2.png

The Sections tab is a good place from which to navigate among the various panels within your page. Clicking on a panel will make its components appear on the Design surface.

DOM tab

AppBase 5.0 > Page Builder > image2013-5-8 17:54:25.png

All new pages come pre-populated with the following four components

Head1 - this corresponds with the <head> tags of any HTML page
PageManager - this manages custom C# code and resources such as the JavaScript navigation library
ResourceManager1 - this manages the following listeners
- AjaxRequestComplete
- AjaxRequestExcption
- BeforeAjaxRequest
- DocumentReady
- TextResize
- WindowResize
- WindowScroll
- WindowUpload
vwViewPort1 - all of the UI components, such as panels, textfields, and buttons are arranged within the ViewPort in a folder structure

All of a page's stores can also be found here

Design surface

Txt

Preview surface

Txt

Source surface

Txt

Toolbox

Txt

Properties

Text