React-datepicker: Year dropdown should not show years after the max date or before the min date.

Created on 29 Nov 2016  路  3Comments  路  Source: Hacker0x01/react-datepicker

If a min/max date is specified then the year dropdown should respect those min/max dates and not allow the user to pick years that are outside of the min/max range.

Most helpful comment

I will make a PR for this

All 3 comments

I will make a PR for this

Ok somewhere between 0.33.0 and 0.41.1 this has been fixed. Whether intentionally or incidentally I'm not sure. In any case. I'm closing this unless someone can reproduce it with the latest version. #759 is still valid.

Good day everyone! - I'm having this issue wrt to version "react-datepicker": "^0.53.0"

My code:

<DatePicker
                    id="automation_datepicker_id"
                    inline
                    selected={state.date}
                    onChange={(event) => {
                        var date = event.format('DD/MM/YYYY')
                        this.props.inputChanged(date)
                        this.props.inputSubmit()
                    }}
                    minDate={moment().subtract(100, "years")}
                    maxDate={moment().add(1, "years")}
                    dateFormatCalendar={'MMMM'}
                    showYearDropdown
                    scrollableYearDropdown
                    yearDropdownItemNumber={50}
                    locale={locale.locale}
                    calendarClassName="rootCalendar"
                />

I'd really appreciate any assistance I can receive regarding this.
The expected behaviour:
The user can't see years beyond 2018 and before 100 years ago
The behaviour:
The yearDropdownItemNumber sets the years selectable in the drop down from 50 years in the past to 50 years in the future. I'd rather have a scrollable set than make the user hit the arrows in the scroll to go to previous years.

I really enjoyed having this datepicker available and appreciate all the hard work you guys have done! With kind regards!

Was this page helpful?
0 / 5 - 0 ratings