CODEWITHSUNDEEP
javascripttwitter-bootstrap
user65165
user65165

Reputation: 972

bootstrap calendar datetimepicker doesn't load when clicked

For some reason this doesn't seem to work...

edit1: in the HTML file (sorry forgot to add the divs first time around)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/a549aa8780dbda16f6cff545aeabc3d71073911e/src/js/bootstrap-datetimepicker.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<link href="http://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/a549aa8780dbda16f6cff545aeabc3d71073911e/build/css/bootstrap-datetimepicker.css" rel="stylesheet"/>

<div class="container">
    <div class="row">
        <div class='col-sm-6'>
            <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>

in the .js file

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

Upvotes: 0

Views: 323

Answers (1)

Nam
Nam

Reputation: 121

Possible reasons/solutions:

  1. There is no element with id "datetimepicker1". Solution: add one.

  2. Depending on where you include the .js file, you may need to call it inside jQuery's ready event. To fix this:

    $(document).ready(function() { $('#datetimepicker1').datetimepicker(); });

Upvotes: 2

Related Questions