Summary -

In this topic, we described about the Month Input type with detailed example.

The month input type accepts the user to choose a month and year from a drop-down calendar. The value is a string in the format "YYYY-MM", where YYYY is the four-digit year and MM is the month number.

Syntax -

<input type="month"  name="expiry" >

Example -

Below example explains how to select a month and year from a drop-down calendar.
<!DOCTYPE html>
<html lang="en">
   <head>
      <title>HTML5 Month Input Type</title>
          <script>
             function getValue() { 
             var month = document.getElementById("mymonth").value;
             alert(month);
             }
           </script>
    </head>
    <body>
        <form>
             <label for="mymonth">Choose Month:</label>
             <input type="month" id="mymonth">
             <button type="button" onclick="getValue();">Get Value<
                                                            /button>
        </form>
    </body>
</html>

Output -



Warning - The input type="month" is not backed by Safari, Firefox, and Internet Explorer browsers. Presently supported in Edge, Chrome, and Opera browsers.
Browser Support

The following browsers and corresponding versions in the table that completely supports the month type.

Input Type Chrome Edge Firefox Safari Opera
Type="month" 25.0 12.0 Not Supported Not Supported 10.1