type date - input using only calendar picker HTML5

Question

Is there any way not to allow to edit date manually? I mean that I would like to force user to pick date using only calendar.

Having

<input type="date"   value="yyyy-mm-dd" class="input-medium search-query">

user can type in something into input form. I have tried to do this way:

<input type="date"   value="yyyy-mm-dd" class="input-medium search-query" disabled>

but it frozen the whole form.

Any hints? Or maybe is there any fast way to prevent user to break date format? (Because I use bootstrap I would not prefer to use jquery)

Answer 1

You could return false when the user presses a key, if your prepared to throw a bit of JS in there:

<input type="date"   value="yyyy-mm-dd" class="input-medium search-query" onkeypress="return false">

Here's a jsFiddle