[SOLUCIONADO] Comparar Fechas con Datapicker de jquery

[BlackJccl1]

Hola todos en mi aplicación tengo el input1 con un data picker y otro input2 con otro data picker lo se quiere hacer es cuando seleccionen la fecha en el input1 por ejemplo 10/04/2015 en el input2 no les permita elegir mas de dos días es decir si elige la fecha que mencione solo le permita elegir los dias 13/04/2015 y 14/03/2015 y por ende el resto de dias quedan des habilitados

Gracias

[MaNuX0218]

Si no voy mal la datapicker puede hacer eso, visita su página seguro que encuentras lo que intentas hacer.

Saludos.

[Alexis88]

Utiliza la opción maxDate.

Saludos

[BlackJccl1]

Hola si lo estoy usando pero no se como asociarlo al otro para que pueda ver que fecha a seleccionado es decir al primer datapicker

Código HTML:

    $( "#fecharcon" ).datepicker({minDate:"-0D"});
    $( "#fecharpc" ).datepicker({minDate:"-0D"});

[Alexis88]

Cuando se produzca el evento onSelect en el primero, aplica la fecha máxima en el segundo.

Por favor, lee la documentación. Ahí está todo lo que necesitas para hacer esto.

Saludos

[BlackJccl1]

Si alexis estoy viendo la documentación pero no mencionan como usarlo solo dice que hace con ejemplo sencillo de como usarlo lo haré pero no lo veo por eso consulto aqui disculpa mi falta de conocimiento

[Alexis88]

Es que en ninguna documentación te van a dar las respuestas exactas a tus problemas, tienes que leer y pensar en la manera de adaptar lo que encuentras a lo que necesitas.

[BlackJccl1]

si entiendo eso, solo he pedido un ejemplo que al final google he encontrado pero recien voy ha probarlo

[Alexis88]

Échale un vistazo a este pequeño ejemplo que hice hace algunos meses. Creo que con eso te puedes dar una clara idea de lo que debes de hacer.

Saludos

[BlackJccl1]

hola alexis estoy usando este codigo pero creo que esta mal

Código:

 $( "#fecharcon" ).datepicker({      
      onSelect:function(dateText,inst){
          var lockDate = new Date($("#fecharcon").datepicker('getDate'));
          $('#fecharpc').datepicker('option','minDate',lockDate);}
        });
    $("#fecharpc").datepicker();

[Alexis88]

Esa última línea está de más pues dentro del onSelect del primero, ya estableces que el segundo también será un datepicker, además, fíjate que le asignas como fecha mínima la fecha seleccionada en el primero y, por lo que he entendido que deseas hacer, quieres que solo queden habilitados los dos días siguientes al seleccionado en el primero.

Puedes probar así:

Código Javascript:

onSelect: function(){
    inicio = $(this).datepicker("getDate"); //La fecha actual del primer datepicker
    final = $(this).datepicker("getDate"); //La fecha actual del primer datepicker
        
    final.setDate(final.getDate() + 2); //Le sumo 2 días
            
    $("#fecharpc").datepicker({
        minDate: inicio, //Le asigno como fecha mínima la fecha elegida en el primer datepicker
        maxDate: final //Le asigno como fecha máxima la fecha del primer datepicker más dos días
    });
}
 

Saludos

[BlackJccl1]

Hola alexis gracias por contestas y darte el tiempo de corregirme lo probe pero no me carga asi lo estoy colocando no se si estoy haciendo algo masl

Código:

    $( "#fecharcon" ).datepicker({
      onSelect: function(){
        inicio = $(this).datepicker("getDate");
        final = $(this).datepicker("getDate");
        final.setDate(final.getDate()+2);
        $("#fecharpc").datepicker({
          minDate: inicio,
          maxDate: final,
        });
      }
    });

[Alexis88]

Lo acabo de probar y funciona correctamente.

Saludos

[BlackJccl1]

Muchas Gracias alexis por date el tiempo de contestar mi pregunta y ayudarme al final fue un error de un corchete en mi función : porra:

[BlackJccl1]

no es por molestar pero ahora surgió otro problema cuando eligen una fecha muy bien se muestra en el input #fecharcon luego se pasan al siguiente input #fecharpc también hace la validación es ahi donde surge el problema, pues cuando cambian nuevamente la fecha en #fecharcon y vuelve a elegir la fecha en #fecharpc se queda con la fecha que elegiste la primera vez como haría para que el otro input #fecharpc también cambien

[Alexis88]

Cuando a un <input> le asignas el widget datepicker, este pasa a tener la clase 'hasDatepicker'.

Lo que tienes que hacer es que cuando selecciones una fecha en el primer calendario, verifiques si el segundo <input> posee la clase en cuestión; de ser así, le quitamos el widget utilizando el método destroy, lo dejamos en blanco y ya luego le volvemos a asignar las fechas máxima y mínima.

Código Javascript:

$("#fecharcon").datepicker({
    onSelect: function(){
        inicio = $(this).datepicker("getDate");
        final = $(this).datepicker("getDate");
        final.setDate(final.getDate()+2);
        
        if ($("#fecharpc").hasClass("hasDatepicker")){
            $("#fecharpc").datepicker("destroy").val("");
        }
        
        $("#fecharpc").datepicker({
            minDate: inicio,
            maxDate: final,
        });
    }
});
 

Saludos

[BlackJccl1]

Muchas gracias Alexis ahora leere mas por tu tiempo y tu respuesta has sido de gran ayuda