Menu
How can I use the Twitter Bootstrap date picker? I used the code below but its not working.
<html> <head> <title>DatePicker Demo</title> <script src="js/jquery-1.7.1.js"></script> <link href="css/datepicker.less" rel="stylesheet" type="text/css" /> <link href="css/bootstrap.css" rel="stylesheet" type="text/css" /> <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" /> <script src="js/bootstrap-datepicker.js"></script> </script> </head> <body> <form > <div class="input"> <input class="small" type="text" value="01/05/2011" data-datepicker="datepicker"> </div> </form> </body> </html> 
639
Because you're defining the code in the head the body and its contents haven't been loaded yet; so the selector finds no elements to initialize datepicker. If you don't want to use document. ready functionality you could also move the script to the end of the body tag.
Date pickers look like text boxes, except that a small calendar icon appears on the right side of the box. To open the pop-up calendar, users click the calendar icon. When the calendar appears, users can click the date that they want on the calendar or use the right and left arrow buttons to scroll through the months.
The most popular bootstrap date picker is currently: https://github.com/eternicode/bootstrap-datepicker (thanks to @dentarg for digging it up)
A simple instantiation only requires:
HTML
<input class="datepicker"> Javascript
$('.datepicker').datepicker(); See a simple example here https://jsfiddle.net/k6qsm5no/1/ or the full docs here http://bootstrap-datepicker.readthedocs.org/en/latest/
77
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
