Eliminar el highlight del día actual en el calendario datepicker

Para poder eliminar el color amarillo fluorescente del día current actual del calendario jquery datepicker podemos usar este código:

  $("#inputdatepciker").datepicker({
                showOn: "button",
                buttonImage: "imagenes/horario.gif",
                buttonImageOnly: true,
                firstDay: 1,
                beforeShow: function (input, inst) {
                    setTimeout(function () {
                        inst.dpDiv.find('a.ui-state-highlight').removeClass('ui-state-highlight');
                    }, 100);
                }
            }).datepicker("setDate", "06/06/2020");
      

Es muy importante que en el html el elemento inputdatepciker sea del tipo input.

<input type='text' id='inputdatepciker" + fecha + "' style='display:none'>

Podemos tambien quitar los iconos del mes anterior y el mes siguiente

 beforeShow: function (input, inst) {
                    //Para quitar el amarillo del día actual y los botones del siguiente mes
                    setTimeout(function () {
                        inst.dpDiv.find('a.ui-state-highlight').removeClass('ui-state-highlight');
                        $(".ui-datepicker-next").hide();
                        $(".ui-datepicker-prev").hide();
                    }, 100);
                },

Y podemos tambien evitar que hagan click en el calendario

onSelect: function(dateText, inst) {
                    //Para no dejar que pinchen en el calendario
                    inst.show()
                }

Saludos

Esta entrada fue publicada en html, JavaScript, Jquery. Guarda el enlace permanente.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *