Обновление DaysOfWeekDisabled для средства выбора даты начальной загрузки в режиме реального времени

У меня есть средство выбора даты, созданное, как показано ниже.

$(".datepicker-class").datepicker({
    format: 'yyyy-mm-dd',
    startDate: date,
    autoclose: true,
    todayHighlight: true,
    datesDisabled: exclude_dates,
    daysOfWeekDisabled: disabledWeekDays
})

Но я хотел бы использовать функцию setDaysOfWeekDisabled для обновления дни недели отключены в режиме реального времени.

Это означает, что изначально если disabledWeekDays = [0] все воскресенья будут отключены.

Но после этого, нажав какую-то кнопку, я хотел бы отключить понедельники, как я могу это сделать?


jquery bootstrap-datepicker
person Abdunnasir K P    schedule 28.11.2018    source источник
comment
Я думаю, что в документе есть ошибка, вы пытаетесь изменить конфиг disabledWeekDays = [6], чтобы увидеть его отключить все воскресенья. :)   -  person son pham    schedule 28.11.2018

Ответы (3)


arrow_upward
1
arrow_downward

Да, вы можете использовать setDaysOfWeekDisabled, который:

Устанавливает дни недели, которые должны быть отключены. Допустимые значения см. в разделе daysOfWeekDisabled.

Опустите daysOfWeekDisabled (или укажите другое ложное значение), чтобы отменить установку отключенных дней недели.

Вот живой образец:

var date = new Date();
var exclude_dates = ['2018-12-01', '2018-12-07'];
var disabledWeekDays = [0];
$(".datepicker-class").datepicker({
  format: 'yyyy-mm-dd',
  startDate: date,
  autoclose: true,
  todayHighlight: true,
  datesDisabled: exclude_dates,
  daysOfWeekDisabled: disabledWeekDays
});

$('#btnDisableMon').click(function(){
  $('.datepicker-class').datepicker('setDaysOfWeekDisabled', [1]);
});

$('#btnDisableSun').click(function(){
  $('.datepicker-class').datepicker('setDaysOfWeekDisabled', [0]);
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker3.css" rel="stylesheet" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.js"></script>

<input type="text" class="form-control datepicker-class">

<button id="btnDisableMon" class="btn btn-primary">Disable Mondays</button>
<button id="btnDisableSun" class="btn btn-primary">Disable Sundays</button>

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

person VincenzoC    schedule 28.11.2018
comment
Я пробовал это, но у него не будет параметров, которые мы установили ранее, таких как формат: «гггг-мм-дд», startDate: дата, автозакрытие: true, TodayHighlight: true, dateDisabled: exclude_dates, нам нужно вызвать «setDaysOfWeekDisabled», [0] вместе с параметрами, которые мы установили. - person Abdunnasir K P; 28.11.2018
comment
@AbdunnasirKP взгляните на фрагмент, приведенный в ответе, я думаю, что все предыдущие варианты сохранены. Если вы хотите динамически установить другой параметр, тогда этот вопрос является дубликатом связанного вопроса. - person VincenzoC; 28.11.2018

arrow_upward
0
arrow_downward

Я думаю, что нет встроенного метода для обновления параметров выбора даты. Вы должны уничтожить предыдущий datepicker и инициализировать с обновленными параметрами.

приведенный ниже код будет работать для вас

     var newOptions = {
   format: 'yyyy-mm-dd',
   startDate: date,
   autoclose: true,
   todayHighlight: true,
   datesDisabled: exclude_dates,
   daysOfWeekDisabled: disabledWeekDays // Update this option value like [0] or [1]
  }

//Destroy datepicker
$('datepicker-class').datepicker('destroy');
// Re-initialize with new options
$('datepicker-class').datepicker(newOptions);
person Hardik Vaishnav    schedule 28.11.2018

arrow_upward
0
arrow_downward

daysOfWeekDisabled: [0, 6] - для нерабочих выходных дней

person Ivan    schedule 17.09.2019