- Home
- Categorie
- Coding e Sistemistica
- Javascript & Framework
- Calendario Check-in Check-out da integrare in un form
-
E' composto da più file, l'ho usato in questa pagina web:
bbopera.it/prenotazione-last-minute-bed-breakfast-catania. html
Vedendo il sorgente puoi vedere i js utilizzati.
L'ideale sarebbe impostare in Check-in la data del giorno in cui l'utente visiona la pagina e una volta selezionato il check-in impostare il check-out un giorno in più rispetto a quello selezionato!
-
Ciao felino,
potresti creare la funzione javascript:function calculateCheckOut(dateCheckin) { var data_arr = dateCheckin.split("/"); data_new = new Date(data_arr[2],(data_arr[1]-1),data_arr[0]); data_new.setDate(data_new.getDate()+1); var dateCheckOutGiorno = (data_new.getDate()<10) ? "0" + data_new.getDate().toString() : data_new.getDate().toString(); var dateCheckOutMese = (data_new.getMonth()<9) ? "0" + (data_new.getMonth() + 1).toString() : (data_new.getMonth() + 1).toString(); var dateCheckOutAnno = data_new.getFullYear().toString(); var dateCheckOut = dateCheckOutGiorno+"/"+dateCheckOutMese+"/"+dateCheckOutAnno); document.getElementById("datacheckout").value = dateCheckOut; }
Nell'html modifica le righe:
[HTML]
Dal: <input onFocus="showCalendar('',this,this,'','holder',0,30,1)" value="" name="dal" size="10" readonly="readonly" type="text" onchange="calculateCheckOut(this.value)">
Al: <input onFocus="showCalendar('',this,this,'','holder',0,30,1)" value="" name="al" size="10" readonly=" " type="text" id="datacheckout">
[/HTML]Considera che non ho testato lo script, dunque vi possono essere alcuni errori anche solo di sintassi.
-
Grazie ayrton2001, l'ho provato, ma non succede nulla!
-
Ragazzi, nessun aiuto!
Ha un nome preciso questa cosa che cerco io? Così da veder se trovo qualcosa sul web?
Grazie!
-
@felino said:
Grazie ayrton2001, l'ho provato, ma non succede nulla!
Se non succede nulla allora vi sarà un errore javascript.
La console degli errori cosa visualizza?
-
non saprei, non lavoro con js, quindi non so come verificare dov'è il problema!
-
Lo testo e ti faccio sapere eventuali correzioni
-
Grazie!
-
testato e funzionante:
javascript da inserire nella pagina prima del tag di chiusura </head>
oppure creare un file js da richiamare (come fai con gli altri js). Ricordati che in quest'ultimo caso nel file .js non devi copiare i tag <script> sia di apertura che di chiusura:<script type="text/javascript"> function calculateCheckOut() { dateCheckin = document.getElementById("datacheckin").value; var data_arr = dateCheckin.split("-"); data_new = new Date(data_arr[2],(data_arr[1]-1),data_arr[0]); data_new.setDate(data_new.getDate()+1); var dateCheckOutGiorno = (data_new.getDate()<10) ? "0" + data_new.getDate().toString() : data_new.getDate().toString(); var dateCheckOutMese = (data_new.getMonth()<9) ? "0" + (data_new.getMonth() + 1).toString() : (data_new.getMonth() + 1).toString(); var dateCheckOutAnno = data_new.getFullYear().toString(); var dateCheckOut = dateCheckOutGiorno+"-"+dateCheckOutMese+"-"+dateCheckOutAnno; document.getElementById("datacheckout").value = dateCheckOut; } </script>
nell'html devi aggiungere i due attributi id e un richiamo alla funzione nell'onfocus
Dal: <INPUT onfocus="showCalendar('',this,this,'','holder',0,30,1)" value="" name="dal" size="10" readonly="readonly" type="text"id="datacheckin"> Al: <INPUT onfocus="calculateCheckOut(); showCalendar('',this,this,'','holder',0,30,1)" value="" name="al" size="10" readonly="readonly" type="text" id="datacheckout">
-
Che dire...grazie!!!
Funziona alla grande, l'ho provato in locale, domani lo metterò online!Grazie davvero!