2

Queria saber como usar corretamente o maxDate e o minDate.

Ex.: meu calendario começar em 1970 e terminar em 2017:

$(document).ready(function(){
                  $('.datepicker').datepicker({              
                    format:'yyyy-mm-dd',
                    i18n:{
                      months: ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'],
                      monthsShort: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez'],
                      weekdays: ['Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta', 'Sexta', 'Sabádo'],
                      weekdaysAbbrev: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sab'],
                      weekdaysShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sab'],
                      today: 'Hoje',
                      clear: 'Limpar',
                      close: 'Pronto',
                      labelMonthNext: 'Próximo mês',
                      labelMonthPrev: 'Mês anterior',
                      labelMonthSelect: 'Selecione um mês',
                      labelYearSelect: 'Selecione um ano',
                      selectMonths: true,
                      selectYears: 4,
                      cancel: 'Cancelar',
                      clear: 'Limpar',  
                      },
                    });
                });

2 Respostas 2

1

No DatePicker, os atributos maxDate e minDate definem a data máxima e mínima consecutivamente que o usuário pode selecionar no calendário.

Existem 3 formas distintas para configurar esses delimitadores:

String em forma de período:

$( ".selector" ).datepicker({
  maxDate: "+2y +1m +1w +4d",
  minDate: "-1m -1w -2d"
});

Onde +2y +1m +1w +4d representa 2 anos, 1 mês, 1 semana e 4 dias contados à partir de hoje (dia corrente).

Legenda:

  • y para anos;
  • m para meses;
  • w para semanas;
  • e d para dias.

Objeto da classe Date:

Você também pode passar um objeto da classe Date:

$( ".selector" ).datepicker({
  maxDate: new Date(2019, 12, 31),
  minDate: new Date(2005, 1, 10)
});

Onde Date(2019, 12, 31) é equivalente ao dia 31 de Dezembro de 2019.

Leitura recomendada: JavaScript - Date


Número de dias:

$( ".selector" ).datepicker({
  maxDate: 15,
  minDate: -20
});

Onde 15 representa 15 dias a partir de hoje (dia corrente) e -20 representa 20 dias antes de hoje (dia corrente) (-1 é ontem e 1 é amanhã).


Todas os 3 métodos estão descritos na documentação (link a seguir). Agora é só aplicar no seu próprio DatePicker!

Leitura recomendada: jQuery-UI DatePicker - maxDate

Leitura recomendada: jQuery-UI DatePicker - minDate

2
  • com o ".selector" não funciona, ainda continua aparecendo anos infinitamente :(
    – Paula
    Commented 17/03/2019 às 22:26
  • Uai, isso aí foi um exemplo. Você vai aplicar isso no seu próprio datepicker conforme sua necessidade. No seu caso, o .seletor é o seu .datepicker.
    – LipESprY
    Commented 17/03/2019 às 22:28
-2

Só uma observação,
new Date(2019, 12, 31) é equivalente a 31 de Janeiro de 2020, pois o mês começa em 0 (zero).
Date(2019, 11, 31), assim é equivalente a 31 de Dezembro de 2019.
Date(2019, 00, 31), assim é equivalente a 31 de Janeiro de 2019.

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 .