the web front-end for your database

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:

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 a number of options including:

  • Left,
  • Right,
  • Top,
  • Inline (appear as place holders), 
  • or None (for those fields that need no introduction).

Although dbFront will automatically adjust the layout depending upon the space available, it will not automatically switch the field label position nor will it rewrite your labels to make them shorter.  For this reason 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 a custom CSS usable class names assigned so that it becomes easier to make custom layout changes.

Carefully Add Field or Form level help

We have a design and plan for adding form level help but it is not there yet.  There always seems to be something more important.  Let us know if you need it and we will make it happen.

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 prefered 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.

Further Reading About Form Design

Content you want the user to see goes here.
close