0

Использую, DatePicker в своем проекте, но не работает функция beforeShowDay. Вот такой код.

var enabledDays = ['11-30-2013', '12-14-2013', '12-21-2013', '3-10-2014', '11-30-2014']

function enableAllTheseDays(date) {
  var m = date.getMonth(),
      d = date.getDate(),
      y = date.getFullYear();
  for (i = 0; i < enabledDays.length; i++) {
    if ($.inArray((m + 1) + '-' + d + '-' + y, enabledDays) != -1) {
      return [true];
    }
  }
  return [false];
}

$('.datepicker').datepicker({
  dateFormat: 'mm-dd-yyyy', //choose the date format you prefer
  beforeShowDay: enableAllTheseDays
});

введите сюда описание изображения
Но ничего не работает. Все даты по-прежнему остаются активными. Использую bootstrap-datepicker.js Как мне сделать активным, только заданный массив дат?

2
  • 1
    проблема не воспроизводится. вы datepicker то из jquery UI используете?
    – teran
    7 фев 2018 в 7:38
  • 1
    зы: зачем вам там цикл, а внутри inArray ? либо одно либо другое выберите.
    – teran
    7 фев 2018 в 7:39

1 ответ 1

1

Раз уж проверил код, то оставлю ответом. Проблема не воспроизводится. Код ваш немного упростил, но работает исправно. Есть сомнения, что вы используйте datepicker из jquery UI. В любом случае, проверьте, вызывается ли ваш коллбэк метод вообще.добавьте внутрь console.log(date).

зы: даты поменял на текущий год-месяц.

$("input").datepicker({
    dateFormat: 'mm-dd-yyyy',
    beforeShowDay: enableAllTheseDays
  });
  
  
var enabledDays = ['2-1-2018', '2-14-2018', '2-21-2018', '3-10-2018']

function enableAllTheseDays(date) {        
     var cd = (date.getMonth() + 1) + '-' + date.getDate() + '-' + date.getFullYear();
     return [ $.inArray(cd, enabledDays) != -1 ]     
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>

<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css">
<input>


апдейт судя по стилям у вам бутстраповский datepicker.

заметьте разницу, если в jquery UI документация говорит вернуть массив

A function that takes a date as a parameter and must return an array with:
[0]: true/false indicating whether or not this date is selectable

то в бутспрапе возвращать надо просто булевое значение

A function that takes a date as a parameter and returns one of the following values:
A Boolean, indicating whether or not this month is selectabl

var enabledDays = ['2-1-2018', '2-14-2018', '2-21-2018', '2-10-2018'];


$("input").datepicker( { 
    dateFormat: 'mm-dd-yyyy' ,
    
    beforeShowDay: enableAllTheseDays
});



function enableAllTheseDays(date) {        
     var cd = (date.getMonth() + 1) + '-' + date.getDate() + '-' + date.getFullYear();     
     return $.inArray(cd, enabledDays) != -1 ;          
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <link id="bs-css" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
    <link id="bsdp-css" href="https://uxsolutions.github.io/bootstrap-datepicker/bootstrap-datepicker/css/bootstrap-datepicker3.min.css" rel="stylesheet">
        <script src="https://uxsolutions.github.io/bootstrap-datepicker/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script>
        
<div class="container">
<div class="row" >
 <div class="col-xs-4">
   <input class="form-control input-sm">
 </div>  
</div>
</div>

3
  • Я использую bootstrap-datepicker под него этот код не сработает?
    – shatoidil
    7 фев 2018 в 7:50
  • @shatoidil да понял уже что бутстрап, счас допишу ответ
    – teran
    7 фев 2018 в 7:53
  • @shatoidil обновил ответ
    – teran
    7 фев 2018 в 8:17

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.