Home / Admin / Limit Range Allowed in Numbers Field
Duplicate Snippet

Embed Snippet on Your Site

Limit Range Allowed in Numbers Field

This snippet will allow you to add a CSS class to any Number field and set a minimum of 5 and a maximum of 20.

After adding this snippet, simply add the CSS class of wpf-num-limit to any Numbers field and the limits will be automatically applied. You can see where to add this CSS class on this screenshot: https://a.supportally.com/i/4HRv5N

If you want to read more about setting restrictions on the range permitted in the Numbers field, you can see the full tutorial here. https://wpforms.com/developers/how-to-limit-range-allowed-in-numbers-field/

100+
Code Preview
php
<?php
/**
 * Limit number range allowed for a Numbers field
 * Apply the class "wpf-num-limit" to the field to enable.
 *
 * @link https://wpforms.com/developers/how-to-limit-range-allowed-in-numbers-field/
 * 
 * For support, please visit: https://www.facebook.com/groups/wpformsvip
 */
  
function wpf_dev_num_limit() {
    ?>
    <script type="text/javascript">
        jQuery(function(){
 
            // Enter 5 minimum (5) and maximum (20) amount for the number field 
            jQuery( '.wpf-num-limit input' ).attr({ 'min':5, 'max':20 } ); 
        });
  
    </script>
    <?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_num_limit', 30 );

Comments

Add a Comment