Bootstrap Datepicker
The Bootstrap datepicker is tied to a standard form input field. In
order the Bootstrap datepicker to work, focus on the input (click,
or use the tab key) to open an interactive calendar in a small
overlay. Choose a date, click elsewhere on the page (blur the
input), or hit the Esc key to close. If a date is chosen, feedback
is shown as the input’s value.
Keep reading our Bootstrap Datepicker examples and learn how to use
this plugin.
Usage
In order to use this plugin on your page you will need to include the following script:
<script src="/assets/js/plugins/flatpickr.min.js"></script>
Initialization
Add the
.datepicker
class on the text input that you want to become a datepicker.
Range datepicker
<input class="form-control datepicker" placeholder="Please select date" type="text" onfocus="focused(this)" onfocusout="defocused(this)">