React-datepicker: enable to set date only if it 18 years old and above

Question

I have a form where a user can submit some info needed

One of the fields is a Date of Birth

I am using react-datepicker package for that specific field

A piece of code looks like this:

        <label>
          <DatePicker
            autoComplete='off'
            dateFormatCalendar="MMMM"
            showYearDropdown
            scrollableYearDropdown
            onChange={this.handleChange}
            selected={this.state.formData.dob}
            maxDate={moment().subtract(6570, "days")}
            minDate={moment()}
            placeholderText="Date of birth"
            name="dob"
            customInput={
              <Input type='text' onKeyPress={e => e.preventDefault()} validations={[required]} value={this.state.formData.dob} />
            }
          />
        </label>

6570 = 18*365 are days converted from 18 years, I know it's a not a solid one, because there are a 364 days also

Here is a screenshot for datepicker not being able to choose a date

https://gyazo.com/4d66a8e59dbca5e79c3af7d6de139d21

Any thoughts or recomendations how can achieve how user can be at least 18 yo to submit a form?

Thank you!

Answer 1

This issue can be resolved by using Specific date range example.

<DatePicker
    selected={this.state.startDate}
    onChange={this.handleChange}
    minDate={moment().subtract(500, "years")}
    maxDate={moment().subtract(18, "years")}
    showDisabledMonthNavigation
/>

You may check the working demo on codesandbox.io.