i'm using ant UI for my react app, there i have a date picker.i want disable dates before current date and after 1 month of current date.
my datepicker
<DatePicker
defaultValue={moment()}
format={dateFormat}
className="datePicker"
onChange={dateHandler}
ref={(dateSelect) => { this.dateSelect = dateSelect }}
disabledDate={(current) => {
return moment().add(-1, 'days') >= current &&
moment().add(1, 'month') <= current;
}}
onFocus={this.rideDateGA}
/>
here if I return moment().add(-1, 'days') >= current
then it is disabled previous dates from todays date but it is not disabling month after dates.
same as if I return moment().add(1, 'month') <= current
then i'm able to disabled next month dates.
my problem i'm unable to return both values.
how can i disable previous dates and next month dates
For the dates to be disabled, you need it to run through both these conditions.
When the condition is:
moment().add(-1, 'days') >= current && moment().add(1, 'month') <= current;
The condition returns false, when the first moment().add(-1, 'days') >= current
is false
, which is why you see that the days before current date are correctly disabled.
For condition to be correct, you need:
<DatePicker
defaultValue={moment()}
format={dateFormat}
className="datePicker"
onChange={dateHandler}
ref={(dateSelect) => { this.dateSelect = dateSelect }}
disabledDate={(current) => {
return moment().add(-1, 'days') >= current ||
moment().add(1, 'month') <= current;
}}
onFocus={this.rideDateGA}
/>