How to validate office-fabric ui DatePicker

Question

I have used Office fabric UI date-picker component and want to show validation message on click of form submit button. Wants to show custom validation messages like "Mandatory field" etc.

Please suggest how to implement it or is there an attribute provided by fabric UI for date-picker validation?

code:

<DatePicker
  className={style}
  label={form.colText}
  showMonthPickerAsOverlay={showMonthPickerAsOverlay}
  onSelectDate={onSelectionChange}
  isRequired={form.mandatory}
  allowTextInput={allowTextInput}
  isMonthPickerVisible={false}
  formatDate={pattern ? date => onFormatDate(date, pattern) : null}
  maxDate={new Date()}
  value={form.value}
  placeholder={messages.datePickerPlaceholder}
/>;

Answer 1

Try to use Redux-form. Create a wrap component.

https://redux-form.com/8.3.0/docs/api/field.md/

Something like below:

<Field name={"startDate"}
       label={"Start date"}
       placeholder={"Select a date"}
       validate={[isRequired]}
       component={DatePicker} />