
How to use Bootstrap Datepicker in Bootstrap 4

Maybe you are struggling with Bootstrap 4 when trying to make a Date picker input in your project using Bootstrap 4. Remember that bootstrap-date picker is not a part of the Bootstrap. So first we include it and then initialize it.
Include Bootstrap-Date picker CSS after Bootstrap 4 CSS:
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.min.css" rel="stylesheet"/>
Now add Bootstrap-Date picker JS and initialize it:
Note: Make sure you have included jQuery plugin before including the given js.
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.min.js"></script> <script> $('#datepicker').datepicker({ weekStart: 1, daysOfWeekHighlighted: "6,0", autoclose: true, todayHighlight: true, }); $('#datepicker').datepicker("setDate", new Date()); </script>
HTML:
<input type="text" name="" class="form-control" id="datepicker">
Thanks for visiting.