5

How do i set maximum or minimum date? Like for instance, i want to limit my daypicker only for the last 2 month (min date) until today (max date). So the user can't choose tomorrow's date. Thanks

http://react-day-picker.js.org/docs/

Riza S
  • 85
  • 1
  • 1
  • 7

2 Answers2

12

You need to use the disabledDays property. It can be passed a set of modifiers as detailed at http://react-day-picker.js.org/docs/modifiers

The following should do what you need:

var twoMonthsAgo = new Date();
twoMonthsAgo.setMonth(twoMonthsAgo.getMonth() - 2);

<DayPicker disabledDays={
{ 
    before: twoMonthsAgo, 
    after: new Date()
}} />
twoleggedhorse
  • 4,938
  • 4
  • 23
  • 38
2

From the docs, React Day Picker Modifiers, it looks like you can pass a prop of fromMonth, which you can calculate to be the month two months before today's date. You can also pass a disabledDays prop that will disable days according to your parameters.

const lastMonth = new Date();
lastMonth.setMonth(lastMonth.getMonth() - 2);
<DayPicker
  fromMonth={lastMonth} 
  disabledDays={{ after: today }}
/>

You may need to tweak that a bit, but it should show you where to go from.

mindlis
  • 1,546
  • 11
  • 17
  • fromMonth includes all dates in that month so if today is 20th April, you can select any date from the​ 1st January using your logic – twoleggedhorse Aug 22 '17 at 20:37
  • It sounds like that is what the question is asking for: the dates in a range from two months ago until today. – mindlis Aug 22 '17 at 20:41