Reducing 2 steps to 1step when clicked on input type=date Reducing 2 steps to 1step when clicked on input type=date reactjs reactjs

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)