Reducing 2 steps to 1step when clicked on input type=date
You can try firing focus or click event:
_onFocus: function() { e.currentTarget.type = "date"; e.currentTarget.focus(); // or .click();}
Try overlaying the date input over the placeholder input and setting the date input to CSS opacity: 0
. Therefore, when the user tries to click the placeholder input, they actually click the date input.
Here is an example JSBin. http://jsbin.com/rozusihade/edit?css,js,output
Notice the onDateInputFocus
and onDateInputBlur
callbacks that update the date input's appearance.
try onfocus=""
<input placeholder="select date" type="text" onfocus="(this.type='date')">
http://codepen.io/anon/pen/zGaQax
Otherwise, I will make a place holder with ng-show, instead of change input tag. Input tag should always be "date" if you want to use native selection of date. (which is always should do)