bootstrap-timepicker не работает

Я пытаюсь заставить timepicker работать аналогично datepicker:

    <div class="form-group">
        <div class="input-group date" data-provide="datepicker">
            <input type="text" class="form-control" placeholder="Date *" id="caldate" required data-validation-required-message="Please choose date.">

            <span class="input-group-addon">
                <i class="glyphicon glyphicon-th"></i>
            </span>
            <p class="help-block text-danger"></p>
        </div>
    </div>
    <script>
        var date = new Date();
        date.setDate(date.getDate()+1);
        $('div.input-group.date').datepicker({
            startDate: date
        });
    </script>

    <div class="form-group">
        <div class="input-group bootstrap-timepicker timepicker">
            <input id="timepicker1" type="text" class="form-control input-small">
            <span class="input-group-addon">
                <i class="glyphicon glyphicon-time"></i>
            </span>
            <p class="help-block text-danger"></p>
        </div>
    </div>
    <script type="text/javascript">
        $('#timepicker1').timepicker();
    </script>

Datepicker работает, но Timepicker не появляется при нажатии. Я сделал что-то не так в части javascript?


javascript html timepicker bootstrap-datepicker
person AusTex    schedule 20.03.2016    source источник
comment
Загружается ли JQuery перед этими сценариями?   -  person WillardSolutions    schedule 20.03.2016
comment
да, и он работает для datepicker   -  person AusTex    schedule 20.03.2016
comment
У меня такое ощущение, что #timepicker1 следует заменить чем-то другим, аналогично div.input-group.date datepicker   -  person AusTex    schedule 20.03.2016
comment
Есть ошибки в консоли браузера?   -  person WillardSolutions    schedule 20.03.2016
comment
Да: TypeError: $(...).timepicker не является функцией $('#timepicker1').timepicker();   -  person AusTex    schedule 20.03.2016
comment
Тогда у вас, вероятно, неправильно загружен js-файл timepicker.   -  person WillardSolutions    schedule 20.03.2016
comment
Да, я назвал неправильное имя (минимальная версия). Теперь ошибка больше не появляется, и по умолчанию отображается 13:30, но по-прежнему ничего не видно при нажатии на кнопку времени.   -  person AusTex    schedule 20.03.2016
comment
не берите в голову. Это было исправлено, когда я изменил ‹link href=css/bootstrap-timepicker.min.css rel=stylesheet› на ‹link href=css/bootstrap-timepicker.min.css rel=stylesheet›   -  person AusTex    schedule 20.03.2016

Ответы (1)


arrow_upward
1
arrow_downward

В голове

<link href="css/bootstrap-datepicker3.min.css" rel="stylesheet">
<link href="css/bootstrap-timepicker.min.css"  rel="stylesheet">

В теле

    <div class="form-group">
        <div class="input-group date" data-provide="datepicker">
            <input type="text" class="form-control" placeholder="Date *" id="caldate" required data-validation-required-message="Please choose date.">

            <span class="input-group-addon">
                <i class="glyphicon glyphicon-th"></i>
            </span>
            <p class="help-block text-danger"></p>
        </div>
    </div>
    <script>
        var date = new Date();
        date.setDate(date.getDate()+1);
        //    $('div.input-group.date').datepicker({
        $('#caldate').datepicker({
            startDate: date
        });
    </script>

    <div class="form-group">
        <div class="input-group bootstrap-timepicker timepicker">
            <input id="timepicker1" type="text" class="form-control input-small">
            <span class="input-group-addon">
                <i class="glyphicon glyphicon-time"></i>
            </span>
            <p class="help-block text-danger"></p>
        </div>
    </div>
    <script type="text/javascript">
        $('#timepicker1').timepicker({
            defaultTime: 'current',
            minuteStep: 1
        });
    </script>
person AusTex    schedule 20.03.2016