How to validate values in mautic forms (Components - Forms)?

Product Support
1

Your software
My PHP version is : 8.0.23
My MariaDB version is : 10.6.10-MariaDB-1:10.6.10+maria~deb11

Your question
My question is :

I am integrating forms into website so people can contact us. I would like to validate the values that people can send.

For example I am using form where a person can enter a domain name.
I would like to validate that the domain name is in the right format for example example.com is a valid domain name examplecom is not a valid domain name.

I also have one form where a person enters a number as a value. I would like to limit the values to only positive number up to for example 1000. Invalid value would be -10 valid value would be 0, 10, 1000.

domain-name
domain-name2619×1345 148 KB

domain-name1
domain-name12627×1123 122 KB

domain-name2
domain-name21300×813 26.6 KB

domain-name3
domain-name31294×653 24.7 KB

Anyone has any idea how to achieve this? I am running the latest Mautic Community 4.4.3
Thank you.

2

For email if you use email field browser validation will validate the value for you <input type=“email” …/>

Same goes for number, select the number type field, turn on field validation and add min max attributes to field.

Unless I misunderstood something that should be all.

3

Thanks for the response. I have a hard time finding “field validation”. Can you post a screenshot where to do this or it’s just custom code?
Validation is only required nothing more. Maybe I am missing something.

4

In the screenshot above you have Validation tab, click on it, and turn on validation. On attributes tab, you can set min, max html attributes.

5

I see here are the help if I hover over the labels

values
values1370×833 55.7 KB

Do you have an example how can I set the value so it will only accept positive number up to 1000 including 0?

6

In Input attributes add the following:

min="0" max="1000"

I think this should cover your requirement.

7

This kind of works. I have a problem now because I have multiple “Page break” and it will let you go next page without any warning and then you won’t be able to submit but you won’t know why. Is there any way to show validation messages and not let the page break to the next page when the values are not valid?

8

Browser validation happens after you hit submit, so if you want to customize that behavior you would need to validate with custom JS.