Una comodissima classe javascript per gestire un calendario su un input di testo. La classe è disponibile in tutte le sue versioni a questo indirizzo. La versione che uso in questo esempio è la Epoch Version 106 leggermente modificata. Richiamo la classe e il suo foglio di stile
<link rel="stylesheet" type="text/css" href="epoch_styles.css" />
<script type="text/javascript" src="epoch_classes.js"></script>
Il codice javascript per creare le due istanze per i calendari
<script type="text/javascript">
window.onload = function() {
var from = new Epoch('epoch_popup', 'popup', document.getElementById('from'));
var to = new Epoch('epoch_popup', 'popup', document.getElementById('to'));
}
</script>
Setto le date iniziali con la funzione date() di php e creo il form per l'invio dei dati
<?php
$from = date("d/m/Y");
$to = date("d/m/Y");
?>
<form method="POST" action="<?php echo $_SERVER['PHP_SELF']; ?>">
dal <input size="10" type="text" id="from" name="from" value="<?php echo $from ?>"/>
al <input size="10" type="text" id="to" name="to" value="<?php echo $to ?>"/>
</form>
Ho aggiunto al costruttore Epoch questa riga
this.tgtelement = targetelement;Ho aggiunto al metodo calConfig quest'altra riga
var ex = this.tgtelement.value.split("/");e ho modficato queste due righe, sempre del metodo calConfig,
this.displayYearInitial = this.curDate.getFullYear(); //the initial year to display on load
this.displayMonthInitial = this.curDate.getMonth(); //the initial month to display on load (0-11)
con queste
this.displayYearInitial = ex[2];
this.displayMonthInitial = ex[1] - 1;
In questo modo riesco a far aprire il calendario nel mese e nell'anno indicati nell'input La classe è rilasciata sotto licenza Creative Commons License GNU Lesser Public, questo significa che è possibile copiarla e modificarla a condizione di mantenere intatto l'avviso di copyright presente a inizio file.
