SingleDatePicker date selection in IE 11 doesnt work
See original GitHub issuereact-dates version react-dates@20.1.0
Describe the bug
Use the SingleDatePicker in your project, build and open the app on IE11 attempt to select (with mouse) the date, notice that calendar opens and then closes but onDateChanged
is not called.
Do the same with the storybook example notice the same result
Source code (including props configuration) Steps to reproduce the behavior:
<SingleDatePicker
id={this.props.id}
date={date}
focused={focused}
onDateChange={updatedDate => this.onDateChange(updatedDate)}
onFocusChange={updatedFocused => this.onFocusChange(updatedFocused)}
displayFormat="ll"
isOutsideRange={this.isOutsideRangeHandler}
numberOfMonths={1}
renderMonthElement={this.renderMonthElement}
/>
Desktop (please complete the following information):
- OS: Windows 10
- Browser IE
- Version 11.706.17134.0
Is the issue reproducible in Storybook? Yes
Additional context
You can navigate with keyboard and select the date - then the onDateChange
is invoked
Issue Analytics
- State:
- Created 4 years ago
- Reactions:6
- Comments:8 (2 by maintainers)
Top Results From Across the Web
SingleDatePicker date selection in IE 11 doesnt work #1639
Use the SingleDatePicker in your project, build and open the app on IE11 attempt to select (with mouse) the date, notice that calendar...
Read more >MVC 4 - Datepicker doesn't work in IE 11 browsers - MSDN
I am new to MVC 4, I have started with basic example and application is working fine, My query is DatePicker doesn't work...
Read more >Datepicker issue in IE11 - jquery - Stack Overflow
We are using a jQuery datepicker which is working fine in Chrome and Firefox but we are having issues with IE11, specifically this...
Read more >react-date-picker - npm
Prop name Description Default value
autoFocus Automatically focuses the input on mount. n/a
calendarAriaLabel aria‑label for the calendar button. n/a
clearAriaLabel aria‑label for the clear button....
Read more >Date Range Picker — JavaScript Date & Time Picker Library
Hi i'm using this as a single date picker, works great. I'm able to set the mindate and maxdate to grey out unavailable...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
As an additional info the
18.4.0
works fine.Actually as @ljharb mentioned in one of other posts related to this issue, it is fixed in v20.2.0, and you can check this out by pulling the project and starting storybook. The reason I was unable to make it work in our project was because react-dates is used in a library that we created and are pulling from npm, and while testing locally, I was not careful enough and didn’t replace react-dates in node-modules folder inside our libraries folder inside main node-modules (if that makes sence) after installing newest version of react-dates in the main project folder. If done correctly, everything’s working just fine.