Number field Print

  • 2

A number field is a field for numeric value input. Contact Form 7 3.4 and higher provides two types of form-tag for number fields: number and range. These work the same except that they provide different types of user interface.

 

The new form-tag types, number and range, correspond with the HTML5 input types number and range, respectively. Currently, only some modern browsers support these input types.

 

Even among modern browsers, there may be differences in how those input fields are rendered on screen. In most cases, a number input is rendered as a spinner control while a range input is rendered as a slider control.

 

Older browsers and some modern browsers don’t support these input types and just render them as traditional text input fields.

 

Both number and number* are used for number input and accept numeric value. number* is a required field.

 

Available options for number and number*

 

OPTIONEXAMPLESDESCRIPTION
min:(num) /min:10 min attribute value of the input element. Allowed minimum value for this field.
max:(num) max:99 max attribute value of the input element. Allowed maximum value for this field.
step:(num) step:3 step attribute value of the input element. When minimum number is 10 and step is 3, acceptable inputs are 10, 13, 16, 19, …
id:(id) id:foo id attribute value of the input element.
class:(class) class:bar class attribute value of the input element. To set two or more classes, you can use multiple class: option, like [number your-text class:y2008 class:m01 class:d01].
tabindex:(num) tabindex:10 tabindex attribute value of the input element.
placeholder watermark   Use the value as placeholder text instead of as default value. watermark works as an alias of placeholder.

 

These fields can have a zero or one value, and the value will be used as the default value of the input field.

 

Example:

 


Was this answer helpful?

« Back

Scroll to Top