Keyboard typing inside html 5 date picker not enabling after css override
I was facing issue with one of the HTML5 date picker wherein I wanted to open it on click inside input text box – Open HTML5 date picker inside input box click
For which one of the user had suggested a fix here but wanted to keep the existing functionality of the HTML5 date picker where I can also type in the date using keyboard.
Please find the css that was used to override the date picker. Any leads on enabling keyboard typing for the existing picker..
I tried doing this <input type="date" onkeydown="return true" /> but didn’t work.
input[type="date"] { position: relative; } /* create a new arrow, because we are going to mess up the native one see "List of symbols" below if you want another, you could also try to add a font-awesome icon.. */ input[type="date"]:after { content: "\25BC"; color: #555; padding: 0 10px; } /* change color of symbol on hover */ input[type="date"]:hover:after { color: #bf1400; } /* make the native arrow invisible and stretch it over the whole field so you can click anywhere in the input field to trigger the native datepicker*/ input[type="date"]::-webkit-calendar-picker-indicator { position: absolute; top: 0; left: 0px; right: 0; bottom: 0; width: auto; height: auto; color: transparent; background: transparent; } /* adjust increase/decrease button */ input[type="date"]::-webkit-inner-spin-button { z-index: 1; } /* adjust clear button */ input[type="date"]::-webkit-clear-button { z-index: 1; } 
In HTML 5, you cannot type in a <input type="date">. As far as I am aware, there is no way to enable this.
First you insert "/js/bootstrap-datetimepicker.min.js"
$("#idinput").datepicker({ format: "mm/dd/yyyy", autoclose: 'true', todayBtn: 'true', todayHighlight: 'true', }) 
