Inserting holidays into jquery datepicker?

Navigation
2

I have a method that changes the datepicker of jquery and inserts some special days (in the case of holidays of the state of RJ), when selecting a holiday, an alert with the day is released, however, it just happens, I wanted to know how block the day as well.

              

     now = new Date();
    var feriados, i, dia;

    <!-- Array com os feriados -->
    var feriados = [
        "01/01/" + now.getFullYear() + " - Confraternização Universal",
        "08/01/" + now.getFullYear() + " - São Sebastião",

        //Fevereiro
        "09/02/" + now.getFullYear() + " - Carnaval",
        "10/02/" + now.getFullYear() + " - Cinzas",

        //Março
        "01/03/" + now.getFullYear() + " - Aniversário da Cidade",
        "08/03/" + now.getFullYear() + " - Dia Internacional da Mulher",
        "23/03/" + now.getFullYear() + " - Paixão de Cristo",

        //Abril
        "19/04/" + now.getFullYear() + " - Dia do índio",
        "21/04/" + now.getFullYear() + " - Tiradentes",
        "22/04/" + now.getFullYear() + " - Descobrimento do Brasil",
        "23/04/" + now.getFullYear() + " - Dia de São Jorge",

        //Maio
        "01/05/" + now.getFullYear() + " - Dia do Trabalho",
        "28/05/" + now.getFullYear() + " - Corpus Cristi",

        //Junho

        //Agosto
        "14/08/" + now.getFullYear() + " - Dia dos Pais",

        //Setembro
        "07/09/" + now.getFullYear() + " - Independência do Brasil",

        //Outubro
        "12/10/" + now.getFullYear() + " - Nsa. Sra. Aparecida",
        "15/10/" + now.getFullYear() + " - Dia dos Professores",
        "19/10/" + now.getFullYear() + " - Dia do Comércio",
        "20/10/" + now.getFullYear() + " - Dia do funcionário Público",

        //Novembro
        "02/11/" + now.getFullYear() + " - Finados",
        "15/11/" + now.getFullYear() + " - Proclamação da Republica",
        "19/11/" + now.getFullYear() + " - Dia da Bandeira",
        "20/11/" + now.getFullYear() + " - Dia da Consciência Negra/Zumbi dos Palmares",

        //Dezembro
        "25/12/" + now.getFullYear() + " - Natal"
    ];

   <!-- Array com os Dias -->
    var dia = [
          "01/01/" + now.getFullYear(),
          "08/01/" + now.getFullYear(),

          //Fevereiro
          "09/02/" + now.getFullYear(),
          "10/02/" + now.getFullYear(),

          //Março
          "01/03/" + now.getFullYear(),
          "08/03/" + now.getFullYear(),
          "23/03/" + now.getFullYear(),

          //Abril
          "19/04/" + now.getFullYear(),
          "21/04/" + now.getFullYear(),
          "22/04/" + now.getFullYear(),
          "23/04/" + now.getFullYear(),

          //Maio
          "01/05/" + now.getFullYear(),
          "28/05/" + now.getFullYear(),

          //Junho

          //Agosto
          "14/08/" + now.getFullYear(),

          //Setembro
          "07/09/" + now.getFullYear(),

          //Outubro
          "12/10/" + now.getFullYear(),
          "15/10/" + now.getFullYear(),
          "19/10/" + now.getFullYear(),
          "20/10/" + now.getFullYear(),

          //Novembro
          "02/11/" + now.getFullYear(),
          "15/11/" + now.getFullYear(),
          "19/11/" + now.getFullYear(),
          "20/11/" + now.getFullYear(),

          //Dezembro
          "25/12/" + now.getFullYear(),
    ];

              $ (function () {

    $('#Data_ProximoContato').datepicker({
        inline: true,
        dateFormat: "dd/mm/yy",
        onSelect: function(dateText, inst){

            for(i=0; i<feriados.length; i++){//cria uma lista com os feriados

                if(dia[i]===dateText){//compara a data selecionada no datepicker com o array dia
                     alert("Cuidado Feriado! \n" + feriados[i]); //imprime o alert com o feriado equivalente a data selecionada
                    }
            }
    }
    });
   });

    
asked by anonymous 26.07.2016 / 18:19

1 answer

3

You should use beforeShowDay tuning: 

$('#Data_ProximoContato').datepicker({
  inline: true,
  dateFormat: "dd/mm/yyyy",
  beforeShowDay: function(dateText, inst) {
    var datepickerDay = ('0' + dateText.getDate()).slice(-2) + '/' + ('0' + (dateText.getMonth()+1)).slice(-2) + '/' + dateText.getFullYear();
    if(dias.indexOf(datepickerDay.trim()) > -1) {
      return [false, "", feriados[dias.indexOf(datepickerDay)].split('-')[1]];
    }
    return [true, "", "disponivel"];
  },
});
$(document).on('click', '#ui-datepicker-div .ui-state-disabled', function() {
  alert('Feriado');
});

EXAMPLE completed in jsfiddle

    
26.07.2016 / 18:35
MySQL does not connect through getConnection () Netbeans Java MySQL not connecting connects by error in socket