Início / coding / Perguntas / 79183812
Accepted
Zenin0
Asked: 2024-11-13 15:34:15 +0800 CST

Como desabilitar os dias da semana por períodos?

  • 772

No momento, estou tentando adicionar um seletor de data ( Boostrap datepicker ) e desabilitar certos dias da semana, como segundas-feiras, para evitar reservas nesses dias em que o escritório está fechado. Encontrei o daysOfWeekDisabledparâmetro e ele funciona perfeitamente, mas não especificamente para esse propósito:

$('#date_return').datepicker({
    language: "es",
    format: 'dd/mm/yyyy',
    autoclose: true,
    todayHighlight: true,
    showMeridian: false,
    startView: 2,
    minView: 2,
    maxView: 1,
    pickerPosition: "bottom-left",
    daysOfWeekDisabled: $scope.daysClosedInLocationOfReturn
});

Esta configuração funciona como esperado, mas agora preciso aplicá-la a períodos específicos. Por exemplo, de 31/12/2024 a 30/12/2025, e depois outro período de 31/12/2025 a 30/12/2026. Além disso, os dias podem mudar dependendo do período.

Também pesquisei online e encontrei o que esperava que resolvesse meu problema:

isInvalidDate: function(date) {
    return date.day() === 0 || date.day() === 6;
}

Com essa função, pensei que poderia adicionar mais condições para verificar critérios adicionais, como anos específicos ou outras condições. No entanto, não funcionou como esperado — não desabilitou os dias da semana nem mostrou nenhuma mensagem de erro. Existe alguma maneira de bloquear dias específicos dentro de certos períodos?

javascript

1 respostas

  1. Best Answer

    Não tenho certeza se você pode ocultar períodos específicos com seu seletor de data atual.

    No entanto, você pode fazer isso com o Bootstrap Datepicker

    Com isso você pode usar beforeShownDaya opção para implementar sua lógica personalizada.

    Exemplo:

    $('#date_return').datepicker({
   language: "es",
   format: 'dd/mm/yyyy',
   autoclose: true,
   todayHighlight: true,
   pickerPosition: "bottom-left",
   beforeShowDay: function(date) {
       var day = date.getDay(); // 0 (Sunday) ... 6 (Saturday)

       // The periods with the days to disable
       var periods = [
           {
               start: new Date(2024, 11, 31),
               end: new Date(2025, 11, 30),
               daysToDisable: [1] // Mondays
           },
           {
               start: new Date(2025, 11, 31),
               end: new Date(2026, 11, 30),
               daysToDisable: [2, 3] // Tuesdays and Wednesdays
           }
       ];

       for (var i = 0; i < periods.length; i++) {
           var period = periods[i];
           if (date >= period.start && date <= period.end) {
               if (period.daysToDisable.includes(day)) {
                   return false; // Disable this specific date
               }
           }
       }
       return true; // Enable all other dates
   }
});
    • 2

relate perguntas