Question 45471 in Html Question posted in
Some basic documentation can be found here.

How to disable specific month between min and max of input type=month? – Html

When using <input type="month"> with min and max, for example:

<input type="month" min="2020-01" max="2020-12">

Is it possible to disable certain months between them?

Tags:

2

Answers


  1. 0

    You could try a custom JavaScript library or a third-party date picker component. I had something on my pc about this one. Modify it to work as you want.

    <html>
  <head>
    <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
  </head>
  <body>
    <input type="text" id="date-picker" />
    <script>
      const disabledMonths = [5, 6, 7];

      flatpickr("#date-picker", {
        minDate: "2020-01",
        maxDate: "2020-12",
        mode: "month",
        disable: [
          function(date) {
            return disabledMonths.includes(date.getMonth());
          }
        ]
      });
    </script>
  </body>
</html>
    Login or Signup to reply.
  2. 0

    Such widgets are built into browsers. Of course, in different cases a certain control is given. In this case, the maximum possible is to use the native argument step. For example:

        <input type="month" min="2020-01" max="2021-02" step="2" />
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search