hide/disable year from HTML date input

Question

Is there a way to hide (mm-dd) or disable (YYYY-mm-0000) the year input from the field? I tried this, but it shows the actual date. If so I need to show 0000

var year = new Date().getFullYear();
document.getElementById('date').setAttribute("min", year + "-01-01");
document.getElementById('date').setAttribute("max", year + "-12-31");

<input type="date" id="date" />

I don't believe there's a way to hide the year part of a date using the standard control. You would need to use a third-party JS library to do this — Rory McCrossan, Sep 09 '21 at 08:43
@RoryMcCrossan so is it possible to disable the year with value: "0000" — Elias, Sep 09 '21 at 08:43
Yes - but only if you want people to set dates between `0000-01-01` and `0000-12-31`. — Rory McCrossan, Sep 09 '21 at 08:48
Looks like the (chrome at least) date picker has a hardcoded minimum of 01/01/0001 - if you type in 0000 for the year, it changes to 0001 — freedomn-m, Sep 09 '21 at 09:08
Here's an [existing answer](https://stackoverflow.com/a/41931400/2181514) for jquery-ui datepicker and fiddle corresponding fiddle: http://jsfiddle.net/zkt5rf4m/ — freedomn-m, Sep 09 '21 at 09:15

Rishni Meemeduma · Accepted Answer · 2021-09-09T09:44:23.747

After searching for an hours,I found jquery datepicker can do the trick.

 var date = new Date();

$(function() {
    $( "#datepicker" ).datepicker({
    dateFormat: "dd-M",
      changeMonth: true,

       minDate:  new Date(date.getFullYear(), 0,1),                                            
       maxDate: new Date(date.getFullYear(), 12,31)
    });
  });

.ui-datepicker-year
{
 display:none;   
}

 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<input type="text" id="datepicker">

you can use https://jqueryui.com/datepicker/ to find out more about jquery datepicker

hide/disable year from HTML date input

1 Answers1