Controls

 

Documentation home

 

See also: Introduction to Styling, Property Sets, Styling Assistants, Control Common Properties

Introduction

 

A control is any element that can be added to a page e.g. input field, table, menu, text etc. Most controls are visible, but this is not necessarily the case.  Available controls are listed below and can be added onto a page by dragging from the Palette View to either the WYSIWYG View or the Outline View.

 

Some controls act as a container, meaning that other controls can be added to the control as children e.g. a Panel Control. Container controls have a layout, which defines how its child controls are positioned within the container.

 

All controls have properties that define the behaviour of the control and are shown in the Properties View when a control is selected in either the WYSIWYG View or the Outline View. Options exist to load and save properties to/from Property Sets which are stored in presentation templates. Properties can also be accessed from a script by referring to controlName.property. For many control properties, it is possible to specify that they should either have a local value or that they should inherit their value from somewhere else, usually a value in a linked Property Set – see local/inherited control properties.

 

Click on the links below for details of each control and a list of supported properties.

Controls

The following controls are available from the Palette View:

 

Article Control

A simple container rendered using an <article> HTML tag, typically used for standalone docs

Aside Control

A simple container rendered using an <aside> HTML tag, typically used for side-panels etc

Barcode Control

A barcode that can be added to a web page or a print page

Bootstrap Column Control

Represents a column in a bootstrap grid – only available in bootstrap mode

Bootstrap Container Control

Represents a bootstrap container – only available in bootstrap mode

Bootstrap Row Control

Represents a row in a bootstrap grid – only available in bootstrap mode

Button Control

Clickable button

Button Column Control

A button within a Table Control

Canvas Control

An HTML <canvas> tag that can be used as a target for graphical content such as charts

Dynamic Menu Item Control

A dynamic menu item within either a horizontal or vertical menu

Field Control

Field

File Upload Controls

Controls enabling users to easily upload files from their local file system.

Finish Button Control

Ebase finish button

Footer Control

A simple container rendered as a <header> that typically contains footer texts and links

Grid Control

A grid layout control

Group Panel Control

A container with title bar and additional texts

Header Control

A simple container rendered as a <header> that typically contains header texts and links etc

Heading Control

HTML heading tags <h1> - <h6>

Horizontal Line Control

Horizontal line

Horizontal Menu Control

Horizontal Menu

HTML Control

Allows HTML to be added

Hyperlink Control

Hyperlink, either internal (runs FPL script) or external

Image Control

An image in a non-table location

Image Column Control

An image within a Table Control

Include Control

Includes an external HTML or JSP file

List Control

An ordered/unordered list for use with dynamic content

List Hyperlink Control

Displays a list item within a List Control as a hyperlink

List Panel Control

An ordered/unordered list for use with static content

List Text Control

Displays a list item within a List Control as a text

Main Control

A simple container rendered using a <main> HTML tag, used for the main content of a page

Menu Item Control

An individual menu item within either a horizontal or vertical menu

Message Control

Acts as a location for error and warning messages

Nav Control

A simple container rendered as a <nav> that typically contains navigation links

Next Page Button Control

Ebase next page navigation button

Page Break Control

Represents a page break when the page is printed to a PDF

Page Navigation Panel Control

A panel containing Ebase page navigation buttons and Ebase save/restore buttons

Page Panel Control

A page level container with a page header text and additional texts

Panel Control

A simple container rendered as a <div>

Previous Page Button Control

Ebase previous page navigation button

Repeater Control

Table where each row is displayed across multiple lines

Repeater List Control

Table where the content is displayed as an ordered/unordered list

Restore Button Control

Ebase restore button (save/restore feature)

Save Button Control

Ebase save button (save/restore feature)

Section Control

A simple container rendered as a <section>

Spacer Control

Horizontal and/or vertical spacer

Tab Control

An individual Tab within a Tab Set

Tab Set Control

Tab Set

Table Control

Table

Table Column Control

Table Column

Table Page Control

A horizontal scroll page within a Table Control

Text Control

Text

Titled Panel Control

A container with a title bar and configurable corners

Vertical Menu Control

Vertical Menu

 

 

The following system controls are not available from the Palette View, but can be configured:

 

Page Control

A special control representing the page – this control cannot be deleted

Component Control

Represents a part-page component

Grid Cell Control

An individual cell within a Grid Control

Repeater Row

A single table row within a Repeater

Repeater List Row

A single table row within a Repeater List