<input type="month">

The <input> elements of type month create input fields that allow the user to enter a month and year allowing you to easily enter a month and year. The value is a string whose value is in the format " YYYY-MM", where YYYY is the four-digit year and MM is the month number.

The user interface of the control generally varies from browser to browser; support is patchy at the moment, with only Chrome/Opera and Edge on desktop and most modern versions of mobile browsers having usable implementations. In browsers that do not support monthgli input, the control gradually degrades to a simple <input type="text">, although there may be automatic validation of the entered text to ensure that it is formatted as expected.

Value

A string representing the month and year value entered in the input, in the format YYYY-MM (four-digit or more-digit year, then a hyphen ("-"), followed by the two-digit month).

Setting a default value

You can set a default value for the input control by including a month and year within the value attribute, like this:

<label for="bday-month">In che mese sei nato?</label>
<input id="bday-month" type="month" name="bday-month" value="2001-06">

One thing to note is that the date format displayed is different from the actual date format of value; Most user agents display the month and year in a locale-appropriate form, based on the user's operating system locale, while the date value is always formatted as yyyy-MM.

When the above value is sent to the server, for example, it will appear as bday-month=1978-06.

Additional attributes

In addition to the attributes common to <input> elements, month inputs offer the following attributes.

list

The values of the list attribute are those of a <datalist> element found in the same document. Provides a list of default <datalist> values to suggest to the user for this input. Any values in the list that are not compatible with type are not included in the suggested options. The values provided are suggestions, not requirements: users can select from this predefined list or provide a different value.

max

The latest year and month, in the string format discussed in the Value section above, to accept. If the value of value entered into the element exceeds this value, the element fails constraint validation. If the value of the max attribute is not a valid "yyyy-MM" string, the element does not have a maximum value.

This value must specify a year-month pairing that is later than or equal to that specified by the min attribute.

min

The latest year and month to accept, in the same "yyyy-MM" format described above. If the element's value value is less than this, the element fails constraint validation. If a min value is specified that is not a valid year and month string, the input does not have a minimum value.

This value must be a year-month pairing earlier than or equal to that specified by the max attribute.

readonly

A Boolean attribute that, if present, means that this field cannot be modified by the user. However, value can still be modified by JavaScript code that directly sets the value of the HTMLInputElement.value property.

step

The step attribute is a number that specifies the granularity to which the value or the special any value, described below, must adhere. Only values that are equal to the base for the step are valid ( min if specified, value otherwise, and an appropriate default value if none of these are provided).

A string value of any means that no step is implied and any value is allowed (subject to other constraints, such as min and max).

For month inputs, the step value is expressed in months, with a scaling factor of 1 (since the underlying numeric value is also in months). The default value of step is 1 month.