I want to make a date picker with a <input type="text"/> element. Because of specific reasons I cannot use the common <input type="date" /> element. In my input I want that the user is able to type in his date of birth in the following format: dd.MM.YYYY
Is there any possibility to create a "pre-defined" value of the input? I mean I'd like to have 2 . (dot) characters in my input value, which the user cannot delete. So one dot at index[3] of the date string and one dot at index[6] of the date string (XX.XX.XXXX).
You can use this: also limit the characters:
.day, .month{
width: 25px;
}
.year{
width:40px;
}
<input type="text" placeholder="DD" class="day" maxlength="2">.
<input type="text" placeholder="MM" class="month"maxlength="2">.
<input type="text" placeholder="YYYY" class="year"maxlength="4">