Calendar display old selected date if i put new selected prop to calendar.
<DatePicker
ref={this.onDatePickerRef}
openToDate={this.state.openDate}
onMonthChange={this.onMonthChange}
customInput={<SelectedDate/>}
popoverTargetOffset='0 0'
dateFormat={isSelectedCurrentYear ? DATE_FORMAT_FOR_CURRENT_YEAR : DATE_FORMAT}
dateFormatCalendar='MMMM'
{...this.props}
selected={this.state.selectedDate}
onChange={this.onSelectedDateChange}
filter={this.datesFilter}
forceShowMonthNavigation={true}
>
<YearsSelector onChange={this.onYearChange} year={this.state.openDate.year()}/>
</DatePicker>
prev selected date 01 april

prev selected date 30 april

How you seen. On filter prop calendar reacts and disable days
We are seeing something similar in our application.
Perform a click anywhere else on the page will cause the calendar to update correctly.
Steps to reproduce:
Expect:
The future date is selected and highlighted
Actual:
The calendar switches back to the old date ( but does not highlight it ). Clicking on a different date after this point will only toggle between the last two dates.
Workaround:
Calling setOpen after the component has been rendered seems to correctly select the date.
This is also happening in the onClickOutside handler, which explains why clicking anywhere else fixes the issue.
<DatePicker inline={true} ref={r => r && r.setOpen(false)} selected={selectedDate} />
@JorgenEvens Thanx, you saved my life! 馃槂
OpenToDate property always take precedence over selected value. Does not specify openToDate
The calendar switches back to the old date
it's a normal behaviour, calendar will scroll to openToDate
@alex-shamshurin I'm using 'inline' option, OpenToDate shouldn't even be considered
if so, do not use it, otherwise it will be scrolled to openToDate value.
@alex-shamshurin So what you are suggesting is that the behaviour on the inline example is intended behaviour?
To be clear I was literally using the component as specified earlier (<DatePicker inline={true} selected={selectedDate} />), not setting openToDate to any value at all when I ran into this issue.
If this is intended I think that the example should be fixed and the documentation should clearly state how inline should be used, because at this point even your explanation confuses me on the purpose of openToDate in the context of an inline calendar.
@JorgenEvens So what is wrong with the inline example? Could you provide more info, please?
@alex-shamshurin I've added steps to reproduce in the second comment of this thread.
Yes, I see this. This will be fixed
@alex-shamshurin the problem is described by @AntonovAv - after clicking on the switch month arrow, selecting date works as some kinda 'stack' and takes value I ckicked 2 steps ago, for example.
Is this still an issue?
Should be fixed now.
Most helpful comment
We are seeing something similar in our application.
Perform a click anywhere else on the page will cause the calendar to update correctly.
Steps to reproduce:
Expect:
The future date is selected and highlighted
Actual:
The calendar switches back to the old date ( but does not highlight it ). Clicking on a different date after this point will only toggle between the last two dates.
Workaround:
Calling
setOpenafter the component has been rendered seems to correctly select the date.This is also happening in the
onClickOutsidehandler, which explains why clicking anywhere else fixes the issue.