Although they are 3 questions, I think they all apply to the same case on the range / range
Is it possible to limit the "interval" between two dates in <input type="month"> ?
If yes, is there any mandatory format we should follow when passing values that limit?
This "limit" is supported by which browsers and mobile devices?
Is it possible to limit the "interval" between two dates in
<input type="month">?
You can use the min and max attributes.
So:
<input id="aniversario" type="month" name="aniversario"
min="1900-01" max="1999-12">
If yes, is there any mandatory format we should follow when passing the values that limit?
In the case of [type=month] , the format must be YYYY-MM (where YYYY is year with 4 digits and MM is the month with two digits).
This "limit" is supported by which browsers and mobile devices?
According to the compatibility table of MDN , the support is not yet complete.
In my Firefox, for example, it did not work. And there is a bug that you have been informed about this input.
Additionally, Internet Explorer and Safari are not supported yet.
On Android, it seems that Firefox is not supported either.
Inaddition,MDNalertsyouaboutdataentryvalidation:
Bydefault,
input[type="month"]does not apply any validation to the entered values. UI implementations generally do not allow you to enter something other than a date, which is useful, but you can still submit the form with the empty entry or enter an invalid date (for example, on April 32).
I found a Polyfill for input[type=month] , but it seems to me that it depends on jQuery (which I do not like it very much.)
Is it possible to limit the "interval" between two dates in
<input type="month">?
Yes, you can limit the "range" between two dates. For this you can use the min and max attribute. Here's an example:
<input type="month" value="2018-09" min="2018-01" max="2018-12"> In the previous example we are limiting the question so that the user can only choose the month in the year 2018, between January and December.
If yes, is there any mandatory format standard we should follow when passing the limiting values?
The mandatory formatting we must follow when using the min , max , or even value attribute is as follows: YYYY-MM .
Where Y is the year, in case 2018, and M is the month, in this case 09. Thus, it would be: 2018-09 .
This "limit" is supported by which browsers and mobile devices?
On Desktop only Chrome / Opera and Edge support.
Inmobilephonesmostmodernbrowserssupport.
Note:whereitismarkedinredmeansthatitisnotsupported,thegreensymbolizesthatthebrowsersupportsthetag.
Accordingto caniuse , currently 86.66% of browsers support (partially or totally) the attribute, between desktop and mobile.
References: