Step-By-Step Guide to Using Advanced Form Customization Settings
1. Access Applications Menu:
Hover over the navigation bar to the left of the dashboard and select ‘Forms’.
2. Access Component Settings:
Hover over the form element you wish to modify, then click on the gear icon that appears.
3. Understand the Component Settings Layout:
Note that the settings menu will change slightly depending on the field you choose to edit. Yet, it maintains a similar structure for each element.
4. Use Display and Validation Settings for a Text Field Component:
In this section, you'll see display and validation settings, with a preview of the component on the right.
Label - Enter the text that will appear next to the text field on the form.
Label Position - Use the dropdown to select the label's position.
Label Width & Label Margin - Define the width of the label and its margin.
Placeholder - Enter custom text that will appear in the field by default. This helps users understand what information they need to enter.
Description - Add a small description that appears next to the field for extra clarification.
Tooltip - Write tooltips that appear when users hover over the question mark next to the label.
Prefix - Add a short word or phrase within the field next to the text entry space.
Widget - Customize the input method for this field. The basic text field is set to Input Field by default. Experiment with different options to see their impact.
Input Mask - Use this to ensure entries in this field follow a specific format. For instance, a phone number in the format of (123) 456-7890.
Tab Index - Define the order in which a user can navigate through the various field options on your form.
Hidden & Hide Label - Hide a field or just the label from users.
Show Word Counter & Character Counter - Enable a counter to appear below your field for words and characters.
Initial Focus - Make this field the first to come into focus when clicking on the form.
Allow Spellcheck - Enable built-in spellchecking to avoid low-quality entries.
Disabled - Deactivate the ability to enter text into this field if necessary.
Validate On - Choose an option to alert users to incorrect entries. Different options change how the alert appears.
Required - Make this field mandatory for a successful form submission.
Maximum/Minimum Length - Define the minimum and maximum number of characters or words allowed in this field.
Regular Expression Pattern - Use this advanced option to ensure users enter the text within a specific format.
Error Label & Custom Error Message - Create a label and message that appears when an error occurs.
5. Use Custom Data Settings:
Certain fields require additional setup. These settings can be found under the Data tab.
6. Adjust Date/Time Settings:
For fields that require date or time inputs, check the box next to Enable Date Input in the settings menu under Date and Time. Here, you can set a minimum date, blacklist dates, disable weekends or weekdays, and customize the increments for the time selector.