use datepicker in formik

[zahraHaghi]

how can I use datepicker in formik?
I used it like this but when I submit form "required" error show
```

<Formik
         initialValues={{title: '', company: '', current: '', location: '', description: '', from: '', to: ''}}
         validationSchema={Yup.object({
             title: Yup.string()
                 .required('Required'),
             company: Yup.string()
                 .required('Required'),
             current: Yup.string()
                 .required('Required'),
             location: Yup.string()
                 .required('Required'),
             description: Yup.string()
                 .required('Required'),
             from: Yup.string()
                 .required('Required'),
         })}
         onSubmit={(values) => {
             console.log(values)
             props.onSubmitExp(values)
         }}
     >
         <Form className="mt-30 mb-30">
             <label htmlFor="title">Title</label>
             <Field name="title" type="text"/>
             <ErrorMessage className="error-message" name="title"/>
             <label htmlFor="company">Company</label>
             <Field name="company" type="text"/>
             <ErrorMessage className="error-message" name="company"/>
             <label htmlFor="location">Location</label>
             <Field name="location" type="text"/>
             <ErrorMessage className="error-message" name="location"/>
             <label htmlFor="from">From</label>
             <DatePicker
                 name="from"
                 value={selectedFrom}
                 onChange={setSelectedFrom}
                 inputPlaceholder="Select a day"
                 shouldHighlightWeekends
             />
             <ErrorMessage className="error-message" name="from"/>
             <label htmlFor="to">To</label>
          
             <DatePicker
                 value={selectedTo}
                 onChange={setSelectedTo}
                 inputPlaceholder="Select a day"
                 shouldHighlightWeekends
             />
             <ErrorMessage className="error-message" name="to"/>
             <label htmlFor="current">Current</label>
             <Field name="current" type="text"/>
             <ErrorMessage className="error-message" name="current"/>
             <label htmlFor="description">Description</label>
             <Field name="description" type="text"/>
             <ErrorMessage className="error-message" name="description"/>

             <button className="submit-btn" type="submit">Submit</button>
         </Form>
     </Formik>

[the-dr-lazy]

To use the DatePicker or Calendar components with Formik you need to create an adapter component that uses Formik context. You can follow this CodeSandBox for inspiration.

[zahraHaghi]

To use the DatePicker or Calendar components with Formik you need to create an adapter component that uses Formik context. You can follow this CodeSandBox for inspiration.

so thankssss. It is worked for me

[Kiarash-Z]

@zahraHaghi We're glad your issue has been resolved. I'm gonna close this issue now

[nishant-k1]

To use the DatePicker or Calendar components with Formik you need to create an adapter component that uses Formik context. You can follow this CodeSandBox for inspiration.

Thank you so much!!