Disable native datepicker in Google Chrome Disable native datepicker in Google Chrome google-chrome google-chrome

Disable native datepicker in Google Chrome


To hide the arrow:

input::-webkit-calendar-picker-indicator{    display: none;}

And to hide the prompt:

input[type="date"]::-webkit-input-placeholder{     visibility: hidden !important;}


If you have misused <input type="date" /> you can probably use:

$('input[type="date"]').attr('type','text');

after they have loaded to turn them into text inputs. You'll need to attach your custom datepicker first:

$('input[type="date"]').datepicker().attr('type','text');

Or you could give them a class:

$('input[type="date"]').addClass('date').attr('type','text');


You could use:

jQuery('input[type="date"]').live('click', function(e) {e.preventDefault();}).datepicker();