Home / Magento 2 - Magezon Blog / How to ensure correct form submission data in Blue Form Builder?

How to ensure correct form submission data in Blue Form Builder?

Ensure correct form submission data

When filling out a form, customers sometimes mistype some information, miss to complete some form fields or fill out in wrong formats. For you as admin, you can’t collect your wanted data. And for customers, wrong submitted data will make it difficult to tell you what they want. That’s why a ‘smart’ form is needed to make sure that customers fill out correctly.

In this article, we’ll show you how to ensure correct form submission in Blue Form Builder – a drag-n-drop Magento 2 form builder.

Before starting, you first need to install Magento 2 form builder and then create a new form.

How to

Go to Content > Blue Form Builder > Manage Forms. Find the form you’ve created in the grid and open its settings.

To ensure correct submitted data of a form field, you need to open the settings of this field by clicking on either the field or its settings icon.

Ensure correct form submission data _ Open form settings

Open Form Builder tab. In the left section, you will see the form fields.

Ensure correct form submission data _ open element settings

After that, a popup will appear. Open Validation tab. In Validation field, choose relevant validation from the drop-down list. For example, with Phone Number form field, we choose “Please enter a valid phone number. For example (123) 456-7890 or 123-456-7890.”

Ensure correct form submission data _ Validation

If you want to make this form field required to complete, open Advanced tab and slide the button Required Field to “Yes”.

Ensure correct form submission data _ required field

Remember to save the settings.

Note: For Email form field, if you use our available “Email” element, then you don’t need to follow these steps as the element is automatically integrated with this function.  

Now let’s see how the validation looks on frontend.

Ensure correct form submission data _ Frontend

Conclusion

In this article, we’ve looked at how to customize a form to ensure customers’ correct submitted data with Blue Form Builder. Don’t forget to leave us a comment below if you have any questions or review.

About Trang Vu

Check Also

Magezon top 3 bestsellers

Magezon top 3 bestsellers

The year 2018 is considered as a successful year of Magezon as we released many …

Leave a Reply

Your email address will not be published. Required fields are marked *

Comment moderation is enabled. Your comment may take some time to appear.