CODEWITHSUNDEEP
reactjsdatepicker
kawnah
kawnah

Reputation: 3404

DatePicker ant design - disable the current/todays date

How do you disable the current/today's date with DatePicker in the Ant Design library? I need to move the default date back one day (I successfully did this) and disable the current day and all days in the future. I have it really close, except I can't seem to disable the current/today? Can you not do that?

This is what I'm trying?

private disabledDate = (current) => {
    return current && current >= moment().endOf('day');
}
....
<DatePicker
    defaultValue={moment().subtract(1, 'day')}
    value={moment(this.state.reportPeriod, dateFormat)}
    format={'MMM D, YYYY'}
    disabledDate={this.disabledDate}
    onChange={this.selectDate}
/>

Upvotes: 1

Views: 2060

Answers (1)

technicallynick
technicallynick

Reputation: 1592

Ant Designs example page has an example of this on codepen. Their function can be found below (assuming you're trying to disable today and days in the past. If you're looking for today and in the future, just use > instead of <.

function disabledDate(current) {
  // Can not select days before today and today
  return current && current < moment().endOf('day');
}

Edit: So the function to disable today and all future dates is: 

function disabledDate(current) {
  return current && current > moment().startOf('day');
}

Upvotes: 4

Related Questions