Layout Components

Layout Components are used to change the general layout of the Form.

HTML Element

An HTML Element component may be added to a form to display a single HTML element. This is useful if you wish to quickly insert and configure some HTML in your form. All unsafe HTML is stripped before rendering to prevent cross-site scripting exploits. This includes tags like <script>, <embed>, and <style>, and attributes like onmouseover or onload.

If you wish to insert more complicated HTML in your form, see the Content component

HTML Tag

The name of the HTML tag to display.

CSS Class

The CSS class to add to the HTML element. You may specify multiple classes by separating them with single spaces.

Attributes

Attributes and their values to add to the HTML element. This is commonly used to add href attributes to <a> tags, or src attributes to <img> tags.

Content

The text content of the HTML element. While adding more child HTML tags here will properly display them, it is recommended you use the Content component to easily write and preview more complex HTML.

Content

Content may be added to a form to provide non-field information. For example, if you need instructions at the top of a form that are for display only, use a Content component. There are no settings for a Content component and the value is not submitted back to the server.

A WYSIWYG editor has been provided to help with formatting the content. If you use the HTML view of the editor, note that all unsafe HTML is stripped before rendering to prevent cross-site scripting exploits. This includes tags like <script>, <embed>, and <style>, and attributes like onmouseover or onload.

Columns

The Column layout component can be used to split any area into two columns. Simply drag and drop the Column button onto the form and the area you drop it on will be split in two.

Field Set

A fieldset can be used to create a title of an area of the form. This is useful to put inside Layout components or in between lots of related fields. This form component is display only and will not be saved to the api.

32 field set

Fieldset Legend

Enter the legend that will appear for the fieldset.

Custom CSS Class

A custom CSS class to add to this component. You may add multiple class names separated by a space.

Panels

Panels are used to wrap groups of fields with a title and styling. These currently map to Bootstrap Panels.

33 panels

Panel Title

Enter the panel title that will be displayed at the top of the panel.

Theme

The theming of the panel. Select one of the options to have the class added to the wrapper div.

Custom CSS Class

A custom CSS class to add to this component. You may add multiple class names separated by a space.

Table

The table component allows creating a table with columns and rows that allow adding additional components within it.

34 table

Number of Rows

The number of rows on the table. This can be adjusted at any time.

Number of Columns

The number of columns on the table. This can be adjusted at any time.

Custom CSS Class

A custom CSS class to add to this component. You may add multiple class names separated by a space.

Striped

Whether or not the table is striped for odd and even rows.

Bordered

Whether or not the table has a border set on it. (This can be changed by your own CSS as well)

Hover

Whether or not to add a hover class on rows when the mouse hovers over them.

Condensed

Whether or not to condense the size of each sell by removing padding.

Please note - Tables may not repsond well when collapsing to a mobile interface. Please utilize the Column component for a mobile reponsive layout option

Well

Wells are wrapped in a div with a class. These currently map to Bootstrap Wells.