|
|
|
|
|
|
|
Getting To know The Web Forms Designer Work Area
|
| |
|
The FormLogix form creator is designed to help you focus on the creation and design of your web forms.
It consists of:
|
|
A) General Toolbar
B) Element Toolbar
C) Design Toolbar
D) Form Design Area
E) Property Grid - Form Settings
F) Property Grid - Element Settings
G) Secondary Side Toolbar
|
|
|
|
Screenshot of the Form Creator work area.
|
| |
 |
General Toolbar
This toolbar focuses on all the general functions of a form, such as saving a form, or publishing a form.
It consists of:
|
|
| Open |
 |
Open a saved page. |
| Save |
 |
Save a page. |
| Print |
 |
Print the page. |
| Publish |
 |
Publish the form. |
| Share |
 |
Share your form. Define it as 'shared' and other users will be able to clone it
and use it as the basis for their form.
|
| Delete |
 |
Delete a page. |
| Copy |
 |
Copy an element in the page. |
| Paste |
 |
Paste an element in the page. |
| Undo |
 |
An ability to cancel one or more last changes that have been done (Ctrl+z). |
| Redo |
 |
An ability to reverse the undo or advances the buffer to a more current state (Ctrl+y). |
| Report |
 |
View the report of the page. |
| New Application |
 |
Creates a new application. |
| New Page |
 |
Opens a new page. |
| Template Gallery |
 |
A way to open and use a template from our gallery. |
| Field Template |
 |
Ready made single or group field templates a user can insert in to a form by choosing from a listbox. |
| Show Html |
 |
A view of the forms html source, and the ability to create a template from it.
This option will not appear in regular users. It is only available for administrator users. |
|
|
Element Toolbar
This toolbar focuses on all the elements and element related features.
It consists of:
|
| |
| Label |
 |
The label enables the user to add short or long text to the form. |
| Textbox |
 |
A text box field in which a user can type letters, numbers, etc. |
| Numeric Textbox |
 |
A text box field in which a user can type only numbers. |
| Password |
 |
This element is like the textbox, only hides the characters entered. It is often used for sensitive input such as passwords. |
| Textarea |
 |
This element creates a multi-line text input control. |
| Listbox |
 |
This element creates a menu, in which there must be at least one option. |
| Linkform |
 |
Link between forms data.
This feature requires a license.
To upgrade your account press here (Login required). |
| Checkbox |
 |
A box with on/off switches that gives the user the option to choose (checked or not checked). |
| Radio Button |
 |
Gives the user the option to select one of a limited number of choices.
There are several buttons, and when one is switched "on" all others are switched "off".
|
| Link |
 |
A connection from one Web resource to another. By activating this links (by clicking with the mouse), users may visit these resources. |
| Linkbox |
 |
An element in which a user can input links. |
| File Upload |
 |
This element allows the user to select files and upload them to the form (attachment up to 145kb).
This feature requires a license.
To upgrade your account press here (Login required). |
| Email |
 |
An element in which a user can input email addresses. |
| Calendar |
 |
An element that allows the user to input a specific date. It consists of year, month and day. |
| Image |
 |
An element that allows the user to add an image to the form. |
| Html |
 |
This element allows to add custom html code to the form. |
| Container |
 |
An object able to contain elements. When this element is moved, all the elements inside move with it as a group.
Fields in the container may also be defined as 'private access fields' and be seen and filled by the form owner only. |
| Multi Line |
 |
Repeatable elements. |
| Submit Button |
 |
By default the submit button submits a form.
It May also be turned into a Reset Button that clears the form fields when activated.
|
| Create With Label |
 |
Checkbox Determining if an element will be presented with a label |
| Show Grid |
 |
Checkbox Determining if a grid will be shown. |
| Snap To Grid |
 |
Checkbox Determining if the elements will be snapped to the grid. |
| Auto Position |
 |
Checkbox Determining that a new element be placed under and aligned the one selected. |
|
|
Design Toolbar
This toolbar focuses on the design aspect of the form: colors, alignments and so on.
It consists of:
|
| |
| Background Color |
 |
Colors the background of the element selected. if no element is selected it colors the form's background. |
| Font Family, Font Size, Font Color |
 |
Allows the user to choose the font family, size and color of text in labels and buttons, and of text input in element boxes. |
| Bold |
 |
Making the text bold. |
| Underline |
 |
Making the text underlined. |
| Italic |
 |
Making the text italic. |
| Border Style, Border Width, Border Color |
 |
Allows the user to determine the border style, width and color around a selected element. |
| Align Left |
 |
A user can select more than one element and can choose this option, and all the elements will align left. |
| Align Center |
 |
A user can select more than one element and can choose this option, and all the elements will align center. |
| Align Right |
 |
A user can select more than one element and can choose this option, and all the elements will align right. |
| Vertical Align Bottom |
 |
A user can select more than one element and can choose this option, and all the elements will vertically align to bottom. |
| Vertical Align Middle |
 |
A user can select more than one element and can choose this option, and all the elements will vertically align to middle. |
| Vertical Align Top |
 |
A user can select more than one element and can choose this option, and all the elements will vertically align to top. |
| Make The Same Height |
 |
Selecting two elements and choosing this option will make the second element's height be like the first. |
| Make The Same Width |
 |
Selecting two elements and choosing this option will make the second element's width be like the first. |
| Make Same Vertical Spacing |
 |
Selecting at least three elements and choosing this option will make the vertical spaces between them equal. |
| Make Same Horizontal Spacing |
 |
Selecting at least three elements and choosing this option will make the horizontal spaces between them equal. |
|
|
Form Design Area
The design area is the most functional and dominant part of the form creator.
It is a white empty canvas, where the form creation and design take place.
|
|
Property Grid - Form Settings
The Property Grid provides information about the form and element settings.
This information can be changed.
It is located on the right side of the form creator screen.
Form Settings focuses on general aspects of the form: form name, form height, etc.
It consists of:
|
|
| Form Name |
A textbox in which the user enters the form name. |
| Form Width |
A textbox containing width of form in pixels. |
| Form Height |
A textbox containing height of form in pixels. |
| Application Name |
A listbox containing all application names. |
| Post Submit Url |
A field to be contained with a Url to go to after the form is submitted.
This can be done in two ways:
1. Filling the textbox with a valid url.
2. Picking a form from the 'URL Picker'. (  )
Leaving this field empty means that the original form will stay open.
|
| Thank You Message |
A textbox in which a user can enter a message that will appear in a special window after the form is submitted. |
| Horizontal Snap |
A textbox showing the space (in pixels) between the horizontal grid lines. |
| Vertical Snap |
A textbox showing the space (in pixels) between the Vertical grid lines. |
| Right To Left Layout |
A checkbox determining if the form is right to left (for forms in Hebrew), or left to right (English). |
| Public Form |
A checkbox determining if the form has external access - public, or not. |
| Mailing List |
A Textbox that determines who will receive a new data entry alert (containing all the data in it), apart from the form owner.
The form owner receives a new data entry alert by default, and so if this field is not filled he will stay the only recipient.
When filling in this field be sure to use valid email addresses separated by a semicolon (;). |
| Background Color |
A Textbox in which the user can enter a custom color and change the backgrond color of the form.
Valid values for this field are: color number (for example: #ffffff), or name (for example: red).
The other option for changing the background color is the listbox in the design toolbar, but this list consists of fixed colors only.
|
| Font Color |
A Textbox in which the user can enter a custom color and change the font color of an element.
|
| Email User Message |
A textbox in which a user can enter a message that will appear in the e-mail that is sent to the form fillers (if 'send copy' checkbox in email element is checked) and recipients listed mailing list.
In order to have a multiple line message please use [n].
For example: Line1[n]Line2 (see also screenshot below).
|
| Spam protect |
A checkbox with which a form owner adds a captcha number to the form to prevent user spamming. |
| Disable Emails |
A checkbox with which a form owner can disable the email sent to him upon every data entry made to the form. |
| Max Rows |
A textbox in which a form owner can determine the maximum entry rows he wants to collect, after which the form will expire. The default value 0 means that there is no row limit. |
| Close Form On |
A textbox in which a form owner can determine the expiration date of his form. Date format is mm/dd/yyyy (mm range from 1-12, dd range from 1-31). |
| Force Single Row Per User |
A checkbox that a form owner can use to limit each user and allow him to submit only one entry. |
|
|
|
|
Property Grid - Element Settings
The 'Element settings' as opposed to the 'Form Settings' is not always displayed.
It is only shown when ever an element is chosen.
On selection the 'Element Settings' table will be displayed (under the 'Form Settings'),
containing the relevant element features.
There are a few basic common features to every element, and they appear
in almost all elements settings.
In addition to the basic features, every element has its special features as well.
The basic features are:
Width - width of an element (in pixels).
Height - width of an element (in pixels).
Backgroung Color - background color of an element.
Font Color - font color of an element.
|
|
|
|
Secondary Side Toolbar
This toolbar is a combination of the three top toolbars and it appears on the right hand
side whenever the form is longer than 670 pixels.
The toolbar was designed to simplify the process of creating a long form. It prevents having
to scroll up in order to add or change elements or settings which were once only located
at the top of the designer.
The toolbar is a user friendly tool that follows you along when you scroll up/down a long form.
It moves in sync with the user and situates itself parallel to him.
The secondary toolbar consists of these elements/settings:
All elements :Label,Textbox,Numeric Textbox,Password,Textarea, Listbox, Linkform...
Font style options: font family, size, color, bold...
Alignment options: align right, align left, vertical align top...
Delete option and background color option.
|
|
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
