CODEWITHSUNDEEP
reactjsdatepicker
Stephen
Stephen

Reputation: 1183

Enable certain dates in a datepicker

I am looking for a datepicker in React where I can enable only certain dates. All the other dates need to be disabled. I can pass a list of dates to the datepicker and it will only allow the dates within this list to be enabled. Does any one know a datepicker that allows this?

Upvotes: 0

Views: 4487

Answers (2)

Nidhi Dadiya
Nidhi Dadiya

Reputation: 839

You can use includeDates from React Datepicker. Modify it with your List of dates.

<DatePicker
  selected={startDate}
  onChange={date => setStartDate(date)}
  includeDates={[new Date('2020-08-08'), new Date('2020-08-09')]}
/>

Upvotes: 3

dave
dave

Reputation: 64657

One example using https://reactdatepicker.com/

const allowedDates = ['2020-06-04', '2020-06-05'];

return (
    <DatePicker
        filterDate={(d) => allowedDates.includes(moment(d).format('YYYY-MM-DD')) }
    />
)

Upvotes: 1

Related Questions