JQuery ui - selector de fecha, deshabilitando fechas específicas

Estoy tratando de deshabilitar fechas específicas utilizando el JQuery Ui. Sin embargo, no estoy teniendo suerte, aquí está mi código:JQuery ui - selector de fecha, deshabilitando fechas específicas

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html lang="en"> 
<head> 
<link rel="stylesheet" type="text/css" href="development-bundle/themes/ui-lightness/jquery.ui.all.css"> 
<style type="text/css"> 
.ui-datepicker .preBooked_class { background:#111111; } 
.ui-datepicker .preBooked_class span { color:#999999; } 
</style> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>jQuery UI Datepicker</title> 
<script type="text/javascript" src="development-bundle/jquery-1.7.1.js"></script> 
<script type="text/javascript" src="development-bundle/ui/jquery.ui.core.js"></script> 
<script type="text/javascript" src="development-bundle/ui/jquery.ui.widget.js"></script> 
<script type="text/javascript" src="development-bundle/ui/jquery.ui.datepicker.js"></script>

objeto Instantiate selector de fechas

<script type="text/javascript"> 

    $(function() { 
    $("#iDate").datepicker({ 

    dateFormat: 'dd MM yy', 
    beforeShowDay: checkAvailability 
    }); 

    })

obtener la fecha se desactivara dentro del calendario

var unavailableDates = ["9-3-2012","14-3-2012","15-3-2012"]; 

function unavailable(date) { 
    dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear(); 
    if ($.inArray(dmy, unavailableDates) == -1) { 
    return [true, ""]; 
    } else { 
    return [false,"","Unavailable"]; 
    } 
} 

$('#iDate').datepicker({ beforeShowDay: unavailable }); 

</script> 
</head> 
<body> 
<input id="iDate"> 
</body> 
</html>

no lo hace parece estar funcionando, alguna idea de cómo puedo resolver esto. aclamaciones.

Fuente

2012-03-16 bobo2000

Parece que está llamando al datepicker dos veces en una entrada. Su tipo de difícil seguir su código, pero si vuelve a organizar y eliminar la segunda llamada datepicker, todo debería funcionar:

<script type="text/javascript"> 
    var unavailableDates = ["9-3-2012", "14-3-2012", "15-3-2012"]; 

    function unavailable(date) { 
     dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear(); 
     if ($.inArray(dmy, unavailableDates) == -1) { 
      return [true, ""]; 
     } else { 
      return [false, "", "Unavailable"]; 
     } 
    } 

    $(function() { 
     $("#iDate").datepicker({ 
      dateFormat: 'dd MM yy', 
      beforeShowDay: unavailable 
     }); 

    }); 
</script>

Ejemplo:http://jsfiddle.net/daCrosby/JjPrU/334/

Fuente

2012-03-16 18:08:36

Funciona perfectamente, una pregunta rápida andrew. ¿Cómo puedo adaptar esto para que las fechas se recuperen de una tabla de base de datos en lugar de las fechas no disponibles que están codificadas en el arreglo? aclamaciones. – bobo2000

@ bobo2000: Eso depende de su tecnología del lado del servidor. Pero me imagino que insertaría la matriz de fechas excluidas en la página al cargar la página en lugar de codificarlas en el código JavaScript. –

Usando PHP. ¿Tendré que consultar el archivo db y completar el conjunto con el conjunto de resultados? – bobo2000

answer..If útil que desee desactivar un día perticular, puede hacerlo de la siguiente manera:

  $scope.dateOptions = { 
      beforeShowDay: unavailable 
      }; 

      function unavailable(date) { 
       if (date.getDay() === 0) { 
        return [true, ""]; 
       } else { 
        return [false, "", "Unavailable"]; 
       } 
      }

lo anterior sólo se permitirá a domingo y todos los demás días serán desactivados. Espero que esto ayude.

Fuente

2016-09-30 07:16:37 Deva

JQuery ui - selector de fecha, deshabilitando fechas específicas

Respuesta

Cuestiones relacionadas