Bootstrap-Datetimepicker not working with the jQuery 3

30.1k Views Asked by At

Bootstrap-datetimepicker is not working with jQuery 3.1.1. I need to use the same jQuery library to run all the other dependent functions.

3

There are 3 best solutions below

7
On BEST ANSWER

As per the docs, the required files for bootstrap datetimepicker to run are :

jQuery

Moment.js

Bootstrap.js

Bootstrap CSS

Bootstrap Datepicker CSS

Locales: Moment's locale files

See this fiddle and check External Resources on the left

Initialize like this

$('#datetimepicker1').datetimepicker();

I have used the following files : jQuery 3.1.1

moment.js

bootstrap.min.css

bootstrap.min.js

bootstrap-datetimepicker.min.css

bootstrap-datetimepicker.min.js

Also, read this installation post in the documentation for better understanding.

1
On

I am getting same error.

input.size is not a function TypeError

modify bootstrap-datetimepicker.js line no: 2253

if (input.size() === {

to

if (input.length === 0) {

line no:2264

if (element.find('.datepickerbutton').size() === 0) {

to

if (element.find('.datepickerbutton').length === 0) {

add css

.input-group.date .dropdown-menu{
     display: block;    
 }
1
On
$('.datepicker-manual').datepicker({
 startDate: new Date(),
 format: 'dd/mm/yyyy', //you can change date format to any
 autoclose: true,
 todayHighlight: true,
 placeholder:new Date(),
 startDate: new Date(), //this will be today's date
 endDate: new Date(new Date().setDate(new Date().getDate() + 360))
});
$(document).on( "change", ".datepicker-manual", function() {
    $(this).datepicker('hide');
});