Как открыть DatePicker с вкладкой? - PullRequest
Новая
       12

Как открыть DatePicker с вкладкой?

0 голосов
/ 29 марта 2019

У меня есть форма выбора даты на форме, которая переведена на португальский язык. При щелчке курсором по нему он отображается нормально, но при переходе по полям формы он не открывается. Я имею в виду, что я могу полностью поставить недопустимую дату, нажав Tab и напечатав. Кто-нибудь может мне помочь?

Я использую материализовать 1.0.0 

$('.datepicker').datepicker({

  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'],
    weekdaysShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sab'],
    weekdaysAbbrev: ['D', 'S', 'T', 'Q', 'Q', 'S', 'S'],
    today: 'Hoje',
    clear: 'Limpar',
    cancel: 'Sair',
    done: 'Confirmar',
    labelMonthNext: 'Próximo mês',
    labelMonthPrev: 'Mês anterior',
    labelMonthSelect: 'Selecione um mês',
    labelYearSelect: 'Selecione um ano',
    selectMonths: true,
    selectYears: 15,
    beforeShow: function(input, inst)
      {
          inst.dpDiv.css({position: 'absolute'});
      }
  },
  disableDayFn: function (date) {

    var DD = ('0' + date.getDate()).slice(-2);
    var MM = ('0' + (date.getMonth() + 1)).slice(-2);
    var YYYY = date.getFullYear();

    var DDMMYYYY = DD + '/' + MM + '/' + YYYY;

    if (DDMMYYYY == '25/01/2019') { return date; }

    if (DDMMYYYY == '04/03/2019') { return date; }

    if (DDMMYYYY == '05/03/2019') { return date; }

    if (DDMMYYYY == '06/03/2019') { return date; }

    if (DDMMYYYY == '19/04/2019') { return date; }

    if (DDMMYYYY == '21/04/2019') { return date; }

    if (DDMMYYYY == '01/05/2019') { return date; }

    if (DDMMYYYY == '20/06/2019') { return date; }

    if (DDMMYYYY == '09/07/2019') { return date; }

    if (DDMMYYYY == '21/10/2019') { return date; }

    if (DDMMYYYY == '15/11/2019') { return date; }

    if (DDMMYYYY == '20/11/2019') { return date; }

    if (DDMMYYYY == '24/12/2019') { return date; }

    if (DDMMYYYY == '25/12/2019') { return date; }

    if (DDMMYYYY == '31/12/2019') { return date; }

    if (DDMMYYYY == '01/01/2020') { return date; }

  },
  disableWeekends: true,
  format: 'dd/mm/yyyy',
  container: 'body',
  minDate: window.date.addDays(7),


});

1 Ответ

0 голосов
/ 01 апреля 2019

Я сделал код таким образом 

    $(function() {
  $('.datepicker').datepicker({

  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'],
    weekdaysShort: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sab'],
    weekdaysAbbrev: ['D', 'S', 'T', 'Q', 'Q', 'S', 'S'],
    today: 'Hoje',
    clear: 'Limpar',
    cancel: 'Sair',
    done: 'Confirmar',
    labelMonthNext: 'Próximo mês',
    labelMonthPrev: 'Mês anterior',
    labelMonthSelect: 'Selecione um mês',
    labelYearSelect: 'Selecione um ano',
    selectMonths: true,
    selectYears: 15,
    beforeShow: function(input, inst)
      {
          inst.dpDiv.css({position: 'absolute'});
      }
  },
  disableDayFn: function (date) {

    var DD = ('0' + date.getDate()).slice(-2);
    var MM = ('0' + (date.getMonth() + 1)).slice(-2);
    var YYYY = date.getFullYear();

    var DDMMYYYY = DD + '/' + MM + '/' + YYYY;

    if (DDMMYYYY == '25/01/2019') { return date; }

    if (DDMMYYYY == '04/03/2019') { return date; }

    if (DDMMYYYY == '05/03/2019') { return date; }

    if (DDMMYYYY == '06/03/2019') { return date; }

    if (DDMMYYYY == '19/04/2019') { return date; }

    if (DDMMYYYY == '21/04/2019') { return date; }

    if (DDMMYYYY == '01/05/2019') { return date; }

    if (DDMMYYYY == '20/06/2019') { return date; }

    if (DDMMYYYY == '09/07/2019') { return date; }

    if (DDMMYYYY == '21/10/2019') { return date; }

    if (DDMMYYYY == '15/11/2019') { return date; }

    if (DDMMYYYY == '20/11/2019') { return date; }

    if (DDMMYYYY == '24/12/2019') { return date; }

    if (DDMMYYYY == '25/12/2019') { return date; }

    if (DDMMYYYY == '31/12/2019') { return date; }

    if (DDMMYYYY == '01/01/2020') { return date; }

  },
  disableWeekends: true,
  format: 'dd/mm/yyyy',
  container: 'body',
  minDate: window.date.addDays(7),

});


});
  function show_dp(){
    $(".datepicker").datepicker('open'); //Show on click of button
   }

HTML 

<div class="row">
        <div class="input-field col s12">
          <input type="text" class="datepicker" id="vencimento" onfocus="show_dp()">
          <label for="vencimento">Vencimento</label>
          <span class="helper-text">É necessário enviar a solicitação no mínimo cinco dias úteis antes do vencimento.</span>
        </div>
      </div>
...