I am working on a domain in which I want to make the calendar visible on click of a search input box.
The HTML code which I have used in order to place a input boxes are:
<div> <div> <input type="text" placeholder="start date"> <span aria-hidden="true "></span> </div> <div> <input type="text" placeholder="end date"> <span aria-hidden="true "></span> </div> </div>
The script files which I have used is:
<script> $("#startdate_datepicker").datepicker(); $("#enddate_datepicker" ).datepicker(); </script>
Problem Statement:
I am wondering what changes I need to make in the order of script files from my domain in order to make that work.
I have a feeling the script files are placed in a wrong order in my domain.
43 Answers
The bootstrap-datepicker is not a part of the Bootstrap. So,you have to include datepicker plugin code, before use it.
$("#startdate_datepicker").datepicker(); $("#enddate_datepicker").datepicker();<script src=""></script> <link rel="stylesheet" href="" integrity="sha384-9gVQ4dYFwwWSjIDZnLEWnxCjeSWFphJiwGPXr1jddIhOegiu1FwO5qRGvFXOdJZ4" crossorigin="anonymous"> <link rel="stylesheet" href="" /> <!-- Include Bootstrap Datepicker --> <link rel="stylesheet" href="" /> <script src=""></script> <div> <div> <input type="text" placeholder="start date"> <div> <span aria-hidden="true "></span> </div> </div> <div> <input type="text" placeholder="end date"> <div> <span aria-hidden="true "></span> </div> </div> </div>If it's not possible to use CDN, you could place the CSS and JavaScript files of the plugin on your server and link to them.
20I think you forgot to add jquery and bootstrap-datepicker to your domain put this codes between <head></head>
Jquery:
Google CDN:
<script src=""></script> or
Microsoft CDN:
<script src=""></script> Also add this:
<script src=""></script> <script src=""></script> <link rel="stylesheet" href=""/> I've got the same issue. First it was a mismatch beetween datepicker and datetimepicker.
Next I've got a new issue with the datetimepicker and found finally that for bootstrap 4.1 there is a sucessor to bootstrap-datepicker : Tempus Dominus.
From the "Installing" section :
<head> <script type="text/javascript" src=""></script> <link rel="stylesheet" href="" /> </head>Next from the "Usage" section :
<div> <div> <div> <div> <div> <input type="text"/> <div> <div><i></i></div> </div> </div> </div> </div> <script type="text/javascript"> $(function () { $('#datetimepicker1').datetimepicker(); }); </script> </div> </div>
