I am using the date/time picker from Eonasden that you can find here. Date Time Picker
I am using HTML from the example:
<div class="container"> <div class="col-md-10"> <div class='well'> <div class="form-group"> <div class='input-group date' id='datetimepicker1'> <input type='text' class="form-control" /> <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span> </span> </div> </div> </div> </div> </div>
It displays the icon fine, but not the calendar drop down. My head script is:
<link href="view/dist/css/bootstrap.min.css" rel="stylesheet" media="screen"> <link href="view/dist/css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen"> <link href="http://cdnjs.cloudflare.com/ajax/libs/jasny-bootstrap/3.0.1-p7/css/bootstrap.min.css" rel="stylesheet" > <script src="http://code.jquery.com/jquery.js"></script> <script src="view/dist/js/bootstrap.min.js"></script> <script src="view/dist/js/bootstrap-datetimepicker.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/jasny-bootstrap/3.0.1-p7/js/bootstrap.min.js"></script> $(function() { $( document ).ajaxStop( function() { $('#datetimepicker1').datetimepicker(); }); });
I receive a console error of "Uncaught ReferenceError: moment is not defined" Does anyone have an idea on how to fix this? It seems to work fine on his sample page.
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.
Try using a more recent version of jQuery UI that is compatible with jQuery 1.9+. See Uncaught TypeError: Cannot read property 'msie' of undefined - jQuery tools. Consider using jQuery 1.9. 1, but it appears to work fine with 1.9.
var year = 2014; var month = 5; var day = 10; var realDate = new Date(year, month - 1, day); // months are 0-based! $('#MainContent_txtDataConsegna'). datepicker({ dateFormat: 'dd/mm/yyyy' }); // format to show $('#MainContent_txtDataConsegna'). datepicker('setDate', realDate);
According to the examples, you need to include this to..
http://momentjs.com/
It has to be after bootstrap.js
, but before the datetimepickerjs
like this..
<script type="text/javascript" src="scripts/bootstrap.min.js"></script> <script type="text/javascript" src="scripts/moment-2.4.0.js"></script> <script type="text/javascript" src="scripts/bootstrap-datetimepicker.js"></script>
It shows it on the GitHub readme..
"Datetimepicker requires moment.js."
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