1

Como bloquear um intervalo de datas utilizando o datepicker ?

Exemplo, hoje é dia 2, começar pelo dia, começar pelo dia atual + 3 dias e bloquear do dia 20 para frente de cada mês. O maxDate bloqueia os proximos meses.

inserir a descrição da imagem aqui

Tentei utilizar o maxDate para testar com o mês atual, mas ele bloqueia o proximo mês

$("#data_aviso").datepicker({
        constrainInput: true,
        showOn: "button",
        minDate: '+3D',
        maxDate: new Date('2019-11-20'),
        changeMonth: true,
        changeYear: true,
        buttonImage: "../../imagens/calendario.png",
        buttonImageOnly: true,
        changeMonth: true,
        changeYear: true,
        dateFormat: 'dd/mm/yy',
        dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','Sexta','Sábado','Domingo'],
        dayNamesMin: ['D','S','T','Q','Q','S','S','D'],
        dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb','Dom'],
        monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
        monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez'],
        onSelect: function(dateText, inst){

            //  VALIDA PARA NÃO DEIXAR PROGRAMAR NA SABADO E DOMINGO
            .....

        }
    });
});

Preciso de um jeito para bloquear um certo período de todo mês, do dia atual + 3 dias e após o dia 20 de todo mês, sem bloquear o proximo mes.

1 Resposta 1

2

Não precisa da opção "minDate" e "maxDate". Use a opção beforeShowDay conforme abaixo:

beforeShowDay: function(date){
   var hoje = new Date(); // pega a data atual
   if ( date.getDate() > 20 || (date >= hoje.setDate(hoje.getDate()-1) && date <= hoje.setDate(hoje.getDate()+3)) ) return [false, ''];
   return [true, ''];
}

Irá bloquear todos os dias após o dia 20 de cada mês ou o dia atual +2 dias pra frente.

Veja exemplo:

$(document).ready(function() {
   $("#datepicker").datepicker({
      dateFormat: 'dd/mm/yy',
      changeMonth: true,
      changeYear: true,
      beforeShowDay: function(date){
         var hoje = new Date(); // pega a data atual
         if ( date.getDate() > 20 || (date >= hoje.setDate(hoje.getDate()-1) && date <= hoje.setDate(hoje.getDate()+3)) ) return [false, ''];
         return [true, ''];
      }
   });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<input type="text" id="datepicker">

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .