Now we all know the classic field types you would expect in any contact form, like the text, number and message fields, maybe even a simple drop-down and a radio-button for giving something to choose from. But beyond those there are a lot of advanced form fields that could really change the way you build forms. They can help you a lot at eliminating wrong user input, leaving you with invalid data and the need to write them to ask for corrections.
Here is a list of fields that help you get the most out of your forms:
Also: Do NOT set any consent checkboxes as active / ticked when the user accesses the page. They must make a clear, affirmative action to agree to whatever you ask of them.
With calculator fields, you can calculate anything from membership fees to interest rates. Create simple quote calculators and cost estimates with addition and multiplication functions. Or ramp things up with more advanced math calculations to build anything you can imagine. To read more about this type of field, visit the Calculations Feature page. And to see which Form Builder Plugins offer calculations, visit the Form Builder Plugin Comparison
Credit Card Field
Nobody really wants to store their credit card information in your form, but there are many cases where you may need this information to process a payment. That’s why form builders offer payment integration where the information added to the Credit Card field is not stored within your site.
It usually comes with integrated card type detection so the user does not have to pick which type of card they are using and it also has built in validation to check that the card format is correct.
Date field / date Picker
The Date field lets users send a preferred date within their form submission. This is extremely practical for reservation based businesses like restaurants and hotels. You can set a minimum and maximum date, so it’s easier for the user to pick the correct date. Some configuration examples:
- Block out days of the week (i.e. no bookings on weekends).
- Block out dates by selecting specific days.
- Set the minimum and/or maximum date based on another date field for more control over the year range. (i.e. to ensure submissions will be from people over or under a certain age)
- Set the minimum and/or maximum date base on the current date.
- Show the datepicker inline so it shows directly in the form.
Often this feature is accompanied by a second type of field, the “Time picker”. The time field is similar to the date field, only the user selects a certain time of day. You can actually combine the Time and Date fields inside the same form, to get the user to send you a specific point in time.
The Email field allows users to enter only a valid email address (anything that contains a @-sign and ends with a TLD like .com). This is particularly important if you have setup an autoresponder or any other kind of validation via email.
The field will have it’s own error message, and some form builders check if the user is using a popular email address (Gmail, Yahoo, etc) so if it includes a typo, the Email field will detect this and suggest a correction.
You can also optionally add an additional ‘Confirm Email’ field, which means that users will have to type their address twice to be able to submit the form.
The new File Upload field lets your visitors upload files directly within the form. Some of the use cases for this feature are:
- Job application forms: applicants can attach their resume files
- User submitted content: Let users or applicants attach a word document, audio file, video or image they want to share (This will also require the Front End Submission feature)
- Customer support: Your customers can attach documents or screenshots to provide additional information on a service request
- CSV file uploads so visitors can send you orders or timesheets. If you combine this with a Zapier integration, this can become quite a powerful process automation.
- Connect your File Upload field with a Stripe payment field so you can take documents and payment together
There can be lots of customization options:
- Maximum upload file size: Limit the maximum file size you’ll receive. Although the absolute limit is set by your hosting provider, you can set a smaller limit using this control.
- Allowed file types: Set which file types the user can upload. This is important in order to make sure you get the proper file from your users and to improve the security of the form.
- Allowed multiple files: Let the user upload multiple files at once. Switching this on will add the ‘Maximum files’ control, which limits the number of uploaded files.
Something to check your form builder against: Does it provide security and validations checks, ensuring your website is never compromised? If there is any doubt, don’t hesitate to use the form builder vendor’s chat or support forum. They are usually quick to react, especially for pre-sales questions 😉
The Hidden Field is not visible to users, and so can be used to capture or display any information you’d prefer to collect without allowing the user to see or change the field value.
For example, the field can be populated dynamically with information like the current page URL, which may be useful for you to see in an entry but would likely be confusing to a visitor if it were visible as they completed the form.
A variation of the hidden field are the “honeypot fields” which you can read more about in “Spam Protection“. Basically they are fields that are hidden to users, but still very likely to be filled out by bots. Thus, if this hidden field contains text, the form will NOT be submitted.
Use this field to let your visitors set a password using your form. It will enable users to type their passwords without showing the characters, for better security when filling in the field. Usually this comes with a confirmation field to make sure the user does not accidentally have a typo when creating the password.
The Rating field displays a set number of icons so that the user can visually select a number or star rating. This can be used for customer satisfaction surveys, or on a product page.
Repeating fields / Repeater fields
If you have been searching for Repeating fields, and you expected a shotgun, you’re in the wrong place..:
Repeating form fields are actually a way to shorten a form by initially showing a group of fields only once.
When using this feature, the field group will display a simple ‘Add’ button for users to add in additional fields if they need to. Users can duplicate the set of fields again and again.
For those who don’t need to add more fields, they can simply ignore the ‘Add’ button and move on through a short, simple and clean form.
Repeaters are really handy for those booking on travel or events websites, for example. The user will need to add information for each member of their group. This gives the website/organizers a clear picture of exactly who is booking and how many people to expect.
You can even use Repeaters in tandem with quotations/cost estimates. For example, if you’re booking a family of five, tickets may be at a reduced rate for the children. In order to display the correct quote, you may need to add in the details of everyone attending in a repeatable section.
The Number Slider field displays a bar that represents a range of numerical values. The minimum and maximum values are easily customizable in your form settings. You can also adjust the slider’s increment value under Advanced Options » Increment. The selected value is shown underneath the slider.
Only website URLs can be entered in this field. The form automatically checks if the URL is in a valid format (for example, https://mysite.com).
To help users avoid formatting confusion, this field will automatically add https:// to the front of a URL written in shorthand. For example, mysite.com would be automatically converted to https://mysite.com.
More advanced form fields..
This is just a small selection of possible form fields. Unfortunately only a few form builders let you use all the advanced fields in the free version, and many vendors don’t fully disclose the features and configuration options of their advanced fields.
But for a shortlist to know which ones you should try out first, use this filter to show the Form Builders with Advanced Form Fields.
And if you were searching for something that’s not in this list, just leave a comment below!