In HTML, the numbers input element allows for
max attributes, which define the minimum and maximum values that can be added to the input field.
In the snippet below, we’ll use jQuery to add
max attributes to specific Numbers field in WPForms.
Adding this code will apply a minimum value of 23 and a maximum value of 40 to any Numbers field with a CSS class named
2) Adding the CSS Class
To add this class to a field, you’ll need to open the form builder, click the field to open its Field Options panel, and open the Advanced Options section.
wpf-num-limit to the CSS Classes field.
Once you’ve saved the form, users will now see a validation error if they add a number that falls outside of the range defined in that code.
And that’s it! You’ve now set a minimum and a maximum number allowed for your Numbers field. Would you like to change the required field indicator? Take a look at our article on How to Change Required Field Indicator.
Action Reference: wpforms_wp_footer_end
Q: Can I use this for pricing items as well?
A: Absolutely! Any number field including the Single Item form field can use this code snippet to restrict the amount.
Q: Will this work on any number field?
A: This concept will work on any number field, including payment fields providing that the
max is under