Form Layout
The primary purpose of form design is to make a form that leads a user through the data in an orderly manner and directs their attention to the most important areas of focus.
To make a form that works well you need to be able to:
- Order fields for logical data entry,
- Group fields that work together,
- Position labels consistently and appropriately,
- Use consistent styling to highlight special areas of attention,
- Carefully Add Table and Field level help,
- Use columns to condense space,
- Adjust the layout to fit the space available.
dbFront allows you to do all this and more...
Order Fields for logical data entry
In the Table preferences, you can specify the field order for the Form Fields on the Form Fields tab. This tab order will automatically follow the field order. For more details see: Table Preferences
Group fields that work together
The Field preferences has a tab named Layout. In this tab, you can create or select a named Layout Group which can hold one or more fields as a unit. A layout group also has special formatting options.
Position labels consistently and appropriately
At the Database, Table and Field level you can specify the label position for the fields. There are many options including:
- Left,
- Right,
- Top,
- Inline (appear as place holders),
- or None (for those fields that need no introduction).
dbFront will automatically adjust the layout depending upon the space available, it will even switch the field label positions to Top if the display is too narrow. If you know that your forms are going to be used on mobile devices then you may prefer left side labels to avoid excessive scrolling with top labels for larger fields or labels that need to be extra-long.
Styling to highlight special areas
In the Database Preferences, you can specify the name of a custom CSS file to load. This would be the best place to place all of the CSS updates for that database. You can also point this to a single corporate CSS style for consistency.
Unless a specific path is specified, dbFront will load the file from the "css" folder. You will use this file to store all of your database-specific CSS styling.
Various dbFront widgets including Tables, Layout Groups, Fields, etc.. can have custom CSS usable class names assigned so that it becomes easier to make custom layout changes.
Table and Field level Help
It is possible to add context-specific client help to many different areas of dbFront including: Fields, Buttons, Tables and Individual Records. For more details see: Custom Help.
Use columns to condense space
Both at the Table Layout and the Group Layout levels, you can specify the number of columns you want dbFront to use for layout. Not only can you specify the number of preferred columns but you can also specify the amount of space they need. if dbFront determines that there is not enough space then it will automatically reduce the number of columns.
Adjust the layout to fit the space available
dbFront will automatically ensure that the forms will properly fit the available screen space. This might include reducing the number of columns in a column layout, or it might involve shifting the position of the table and details.