I'm trying to use the Bootstrap datepicker function for react. I implemented the solution from the following thread: React DatePicker Bootstrap up to date.
The import looks like:
import Form from 'react-bootstrap/Form';
import Row from 'react-bootstrap/Row';
import Col from 'react-bootstrap/Col';
import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css'
And my code currently looks something like:
return(
<Form>
<Row>
<Col xl={5} lg={5}>
<Form.Group as={Row} controlId="fcField">
<Form.Label column xl={3} lg={3} className="mr-1">Form Label:</Form.Label>
<Col xl={9} lg={9}>
<Form.Control
size="sm"
type="date"
readOnly={!editFlag}
name="shipdate"
value={convertDate(selectedBuild.shipdate ? selectedBuild.shipdate : '', '-')}
onChange={onChangeHandler}
onBlur={dateBlurHandler}
/>
</Col>
</Form.Group>
</Col>
</Row>
</Form>
)
But the "date" type only renders the browser default, seen in this picture.
From my understanding, it should look like what is in the bootstrap document:
There are many aspects of the bootstrap datepicker that I would like to use, and they are not taken as arguments into my Form.control.
From the previous forum post, it looked like all I had to do was set the form.control type to "date". But apparently that is not happening.
What can I do to access the bootstrap datepicker?
