1

Siguiendo esta pregunta, quiero agregar una cosa más: Datepicker sin sábado/domingo, sin feriados, a partir de determinado día

Muestro el código

var QuitarFechas = ["6/8/2020","17/8/2020","02/11/2020","25/12/2020","31/12/2020"];
        
function deshabilitar(date) {
  hoy = date.getDate() + "/" + (date.getMonth()+1) + "/" + date.getFullYear();
  if ($.inArray(hoy, QuitarFechas) < 0) {return $.datepicker.noWeekends (date)} 
  else {return [false,"","Fecha deshabilitada"];}
  }
  $(function() {
    $('#datepicker').datepicker({ 
        minDate: 3,
        beforeShowDay: deshabilitar
    });                         
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css"/>
<input id="datepicker">

El código muestra 3 días por adelantado y elimina tambíen los fines de semana. Lo que quiero también es que sólo se ven 5 días por adelantado desde la fecha de los 3 días.

Pongo un ejemplo: hoy es martes y según la configuración se ve la fecha del viernes próximo. Lo que quiero es mostrar el intervalo entre el viernes y el siguiente viernes de la siguiente semana, ya que lo fines de semana también están inactivos.

Lo que quiero es solo aparezca el intervalo de fechas de 5 días hábiles. El código es correcto, pero aparecen todas las fechas activas a partir del tercer día y lo que quiero es que solo aparezcan activas en un intervalo de 5 días. Las fechas posteriores que aparezcan en el mismo formato como los días del fin de semana y tres días en adelante desde la fecha del día. Sé que es un poco engorroso, pero la idea es que el usuario no pinche en días fuera de ese intervalo.

4
  • Veo que el código funciona bien, ¿cuál es el problema que tienes? o ¿cuál es la pregunta?
    – jachguate
    Commented el 31 may. 2023 a las 9:29
  • Lo que quiero es solo aparezca el intervalo de fechas de 5 días hábiles. El código es correcto, pero aparecen todas las fechas activas a partir del tercer día y lo que quiero es que solo aparezcan activas en un intervalo de 5 días. Las fechas posteriores que aparezcan en el mismo formato como los días del fin de semana y tres días en adelante desde la fecha del día. Se que es un poco engorroso, pero la idea es que el usuario no pinche en días fuera de ese intervalo.
    – Jhon
    Commented el 31 may. 2023 a las 14:09
  • 2
    @Yussef la pregunta no es de él ;)
    – Alfabravo
    Commented el 31 may. 2023 a las 15:04
  • 1
    @Alfabravo Seré menso!
    – Yussef
    Commented el 31 may. 2023 a las 22:19

1 respuesta 1

1

La función que estás creando simplemente define cómo se visualiza cada día. Por lo tanto, hay que decirle ahí que, si está más de cinco días en el futuro, tampoco lo deje seleccionar. Entiendo que siempre tendrás por ahí en medio fines de semana (3 días y 5 días dan más de una semana) así que con poner el parámetro maxDate podría funcionar

var QuitarFechas = ["6/8/2020","17/8/2020","02/11/2020","25/12/2020","31/12/2020"];
        
function deshabilitar(date) {
  hoy = date.getDate() + "/" + (date.getMonth()+1) + "/" + date.getFullYear();
  if ($.inArray(hoy, QuitarFechas) < 0) {
     return $.datepicker.noWeekends (date)} 
  else {
     return [false,"","Fecha deshabilitada"];}
  }
  $(function() {
    $('#datepicker').datepicker({ 
        minDate: 3,
        maxDate: '+9d',
        beforeShowDay: deshabilitar
    });                         
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css"/>
<input id="datepicker">

1
  • Ahora si. No tenía claro como crear la función. Ahora funciona como lo quería, sobre todo por el rango de fechas y que los usuarios no puedan seleccionar fuera de ese intervalo. Gracias.
    – Jhon
    Commented el 31 may. 2023 a las 15:37

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.