Advanced Fields
Home> CHEFS Components > Form Builder Components > Advanced Fields
 |
Advanced Fields in form builders are an extension of Basic Fields, specifically designed to cater to more complex requirements. They offer additional features, functionality, or customization options beyond what the Basic Components provide |
|---|
Page content:
- Text Field
- Text Area
- Url
- Number
- Phone Number
- Tags
- Address
- Password
- Date/Time
- Day
- Time
- Select Boxes
- Select
- Currency
- Radio
- Button
- Survey
- Signature
The Text/Images input field is a versatile option for entering short and general text. It provides rules and validations to manage and format the information based on specific requirements. It also offers additional features like multiple masks, label hiding, word/character counters, spellcheck, and disabled mode for added functionality.
The Email component is a string field that carries special input validation ensuring the entered data is in a valid email format. A valid email address consists of an email prefix and an email domain, both in acceptable formats.
The Text Area input field is an enhanced version of a multi-line input field with (Basic layout). It enables users to enter multiple lines of text, making it ideal for longer messages, descriptions, or comments.
In addition to the basic functionality, the Text Area offers several advanced features:
- Hidden: It can be hidden from view.
- Hide Label: The label associated with the Text Area can be hidden.
- Show Word Counter: It displays a counter indicating the number of words entered.
- Show Character Counter: A counter indicates the number of characters entered.
- Initial Focus: It can be set to receive focus when the page loads automatically.
- Allow Spellcheck: It enables spellcheck for the entered text.
- Disabled: It can be disabled, preventing any user interaction.
- Table View: It can be displayed in a table format.
- Modal Edit: It can be edited within a modal window.
Similar to the Email field, the URL component is a string field that carries special input validation ensuring the entered data is in a valid URL format. Validation will check to see if the entered input data is at least in the correct format to be a legitimate URL potentially.
Use a Number field whenever a field should be limited to a number value type. There are options to set thousands separators, decimal places, and decimal requirements.
The Phone Number field carries an input mask to force the user to enter the field data in Phone Number format.
The Tag component draws attention to or categorizes elements on your form. Multiple tags can be added to one Tag field.
Back to top The Address component is a special component that performs an address lookup based on user input using several map and location providers as well as Custom Provider support. Address data can also be entered in free form and will save the address as well as geolocation and other metadata.
Unique Settings
Enable Manual Mode: Checking this setting adds a checkbox under the Address field. Should the user check this, the address lookup through the location provider is disabled, and the traditional address field will display for manual input (Address, City, State, Zip etc)
Switch To Manual Mode Label: The label of the checkbox used for the 'Enable Manual Mode' setting.
Disable Clear Icon: Removes the 'x' clear icon found at the far right of the field. You may want to check this setting to prevent any users from accidentally clicking the icon.
Form.io is integrated with several Location and Map providers for fast and easy address lookup and geolocation data.
Azure Maps: Set up your own Azure Map account and provide the subscription key to enable this map provider.
Open Street Map Nominatim: Nominatim is a tool to search OSM data by name and address and to generate synthetic addresses of OSM points
Custom: Provides settings to integrate your own custom map provider.
Google Maps: Set up a Google Map API to utilize Google's location and map technology.
Manual Mode View String: Specify the template to be used when querying the view string for component values entered in manual mode. This string is used in the table view, CSV export, and email rendering. When left blank combined value of all components joined with a comma will be used.
- Basic Layout
- Basic Fields
- Advanced Layout
- Advanced Fields
- Advanced Data
- BC Government