jquery-ui - ejemplos - jquery ui datepicker time

Compruebe si el selector de fechas está abierto

Question

Tengo un campo con un selector de fechas. Quiero saber si está abierto. Lo he intentado con:

$("#filter_date").datepicker( "widget" ).is(":visible")

Pero vuelve siempre cierto.

¿Cómo puedo comprobar si está abierto?

Answer 1

Acceda al atributo de estilo del selector de fechas y compárelo con un estilo cuando el selector de fechas está oculto (pantalla: ninguno):

var datePickerStyle = $(''.datepicker'').attr(''style'');
var noneStyle = ''display: none;'';
if(datePickerStyle.indexOf(noneStyle) != -1){
     console.log(''shown'');
} else {
     console.log(''not shown'');
}

Answer 2

Desde lo alto de mi cabeza, podría pensar en usar los eventos beforeShow y onClose definidos para el control del beforeShow para alternar una clase (o una bandera) en algún lugar, y verificar la presencia de los mismos para determinar si el control del beforeShow está abierto o no.

Answer 3

Esto podría ser un posible error en el pasado. Ahora esta solucion

$("#filter_date").datepicker( "widget" ).is(":visible")

funciona perfectamente

Answer 4

Simplemente establece:

#ui-datepicker-div { display: none; }

en su archivo CSS y su código:

$("#filter_date").datepicker( "widget" ).is(":visible")

funcionará correctamente!

Answer 5

   var isCalendarVisible;     
   $(".datepicker).datepicker().on("show", function () {
          isCalendarVisible = true;
    }).on("hide", function () {
          isCalendarVisible = false;
    });

He utilizado este enfoque para alternar el selector de fecha al hacer clic en un botón. isCalendarVisible que se actualiza en ''show'' & ''hide'' de datepicker en consecuencia. Verifico el valor de ''isCalendarVisible'' para abrirlo o cerrarlo manualmente.

    function toggleCalendar() {
        if (isCalendarVisible) {
            $(".datepicker .add-on").datepicker("hide");
        } else {
            $(".datepicker .add-on").datepicker("show");
        }
    }