here's my code, i'm trying to force the two date fields always to be different, the end date must be at least 1 day after the start date.
const EditSchema = Yup.object().shape({
StartDate: Yup.date()
.transform(value => (isDate(value) ? undefined : value))
.typeError('Enter a start date')
.required('Enter a start date'),
EndDate: Yup.date()
.min(Yup.ref('StartDate'), 'End date must be after start date')
.transform(value => (isDate(value) ? undefined : value))
.typeError('Enter an end date')
.required('Enter an end date')
});
After hours trying to figure out how to do it.
here's the code.
when you have a date picker and you select a date, it will be something like this "01/01/2021 00:00:00".
So if you need the end date to be at least 1 day after the start date, you've got to add 1 hour to the start date which will not let you put 2 equal dates.
StartDate: Yup.date()
.transform(value => (isDate(value) ? undefined : value))
.typeError('Enter a date')
.required('Enter a date')
),
EndDate: Yup.date()
.min(Yup.ref('StartDate'), 'End date must be after start date')
.when('StartDate', (st, schema) => {
if(st != null){
st.setHours(st.getHours() + 1);
return schema.min(st)
//this else prevents your page from crashing if there's any other input
}else
return schema.min('1900-01-01')
})
.transform(value => (isDate(value) ? undefined : value))
.typeError('Enter a date')
.required('Enter a date')
});