Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Datepicker exclude past dates

I'm using this lib in my app:

https://reactdatepicker.com/

There is an excludeDates prop which I can use, where I can pass a list of dates aka this would exclude today and yesterday:

excludeDates={[moment(), moment().subtract(1, "days")]}

I would prefer to have a better way than passing however many hundreds of dates into that array though.

Thanks!

like image 481
penguinsource Avatar asked May 31 '18 14:05

penguinsource


People also ask

How do I turn off past dates in react calendar?

To disable the past and future dates, we have to use the isValidDate property of the react-datetime.

How do I turn off date before today in react?

Disable input DateRangePicker allows date and time input via keyboard by default, if you wish to disable it, you can disable editing by setting editable={false} .

How do you disable future dates in input Type date in react?

To disable the dates, we have to use the isValidDate property of the react-datetime. As per the documentation, isValidDate is the function and by default is returning the true value.


1 Answers

Maybe you can use the component like that:

<DatePicker
  selected={this.state.startDate}
  onChange={this.handleChange}
  minDate={moment().toDate()}
  placeholderText="Select a day"
/>

You can use minDate and maxDate props to select a unique range of date selectable.

like image 187
benjamin Rampon Avatar answered Oct 17 '22 01:10

benjamin Rampon