2014-02-09 3 views
9

Я использую Bootstrap datepicker с помощью API Bootstrap-datepicker. Когда я нажимаю кнопку, отображается всплывающее окно calendar/datepicker, но оно не маркирует текущую дату как синий шрифт, как показано в примерах API.Bootstrap datepicker pop-up не отображается выделенная текущая дата

Я использую следующий код:

<body> 
    <div class="input-group date col-md-5" id="datepicker" data-date-format="dd-mm-yyyy"> 
     <input class="form-control" size="56" type="text" value="" readonly> 
     <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span> 
    </div> 

    <script src="js/bootstrap-datepicker.js"></script> 

    <script type="text/javascript"> 
     $('#datepicker').datepicker(); 
    </script> 
    </body> 

календарь/DatePicker всплывающее окно отображается, но текущая дата не подсвечивается, как синий, как показано в примерах API, а также курсор мыши не указатель.

Пожалуйста, помогите мне по этому вопросу

+0

убедитесь, что вы добавили шрифты для glyphicons. Класс «glyphicon» работает, если шрифты включены – Garry

ответ

13

Если вы используете это: https://github.com/eternicode/bootstrap-datepicker вы должны дать варианты, когда вы начинаете календарь, такие как

$('#sandbox-container input').datepicker({ 
       todayHighlight: true 
    }); 
+1

Он по-прежнему не работает :( –

+0

Можете ли вы сделать jsfiddle. Будет полезно – Gokhan

+0

Это сработало? Это не работает для меня/ – Akki619

0

Bootstrap Datepicker зависит от его собственного CSS для укладки календаря виджет.

Для быстрого импорта зависимость, вы можете выбрать версию с cdnjs (убедитесь, что вы выбираете расширение .css) и импортировать в ваш HTML, как это:

<head> 
    <meta charset="UTF-8"> 
    <!-- ... --> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.1/css/bootstrap-datepicker.css" /> 
</head> 
0

Просто добавьте в список возможных решений, поскольку я испытывал ту же проблему. today класса не получал назначен на текущий день с помощью:

$('.datepicker').datepicker({ 
    'format': 'mm/dd/yyyy', 
    'todayHighlight': true 
}); 

HTML в примере имеет класс только date.

<div class="input-group date"> 
    <input type="text" class="form-control" value="12-02-2012"> 
     <div class="input-group-addon"> 
      <span class="glyphicon glyphicon-th"></span> 
     </div> 
</div> 

В моем случае у меня отсутствовал класс datepicker. Добавлено это к элементу, и теперь все работает правильно.

должно быть:

<div class="input-group date datepicker"> 
    <input type="text" class="form-control" value="12-02-2012"> 
     <div class="input-group-addon"> 
      <span class="glyphicon glyphicon-th"></span> 
     </div> 
</div> 
0

Другой вариант, чтобы добавить этот атрибут к вашему datepicker входного элемента:

today-highlight="true"

Смежные вопросы