autocompletamento campo select per giorno e mese attuale

**itanic80** · 26-03-2012, 17:13

Ciao a tutti, Vi chiedo umilmente il Vosto aiuto poichè sto impazzendo con un codice, e spero questa sia la sezione giusta.

Sto creando un motore di ricerca voli, ed ho la necessità di far popolare i campi select del giorno e del mese con la data corrente.
Mi spiego meglio:

qui il motore: http://www.hosisrentals.com/voli/air3.php

se vedete nel campo data di partenza e di arrivo mi da valori 1 gennaio e cliccando sulla gif del calendario mi apre il calendario con 1 gennaio 2013.

Volevo sapere come fare per impostare in automatico la data odierna dei select.. qualcuno mi aiuta?

posto il codice di riferimento per chiarire meglio:

codice:

<table  width="560" border="0">
<tr>
<td  width="50%" align="left">

<table style="width: auto;">
<tr>
<td>
<span class=" EmphasizedText Text InlineBox" >Partenza</span></td>
<td>
<span class=" EmphasizedText Text InlineBox" >Data</span></td>
<td>
<span class=" EmphasizedText Text InlineBox" >Orario</span></td>
</tr>
<tr>
<td>
<select name="outday" id="outday">
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
<option value="8" >8</option>
<option value="9" >9</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18</option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21" >21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24" >24</option>
<option value="25"  >25</option>
<option value="26" >26</option>
<option value="27" >27</option>
<option value="28" >28</option>
<option value="29" >29</option>
<option value="30" >30</option>
<option value="31" >31</option>
</select>
</td>
<td>
<select name="outmonth" id="outmonth" >
<option value="0" >Gennaio</option>
<option value="1" >Febbraio</option>
<option value="2" >Marzo</option>
<option value="3" >Aprile</option>
<option value="4" >Maggio</option>
<option value="5" >Giugno</option>
<option value="6" >Luglio</option>
<option value="7" >Agosto</option>
<option value="8" >Settembre</option>
<option value="9" >Ottobre</option>
<option value="10" >Novembre</option>
<option value="11" >Dicembre</option>
</select>
</td>
<td>
<select name="outhour" onchange="if (wiresJS.selectAnyTime) wiresJS.selectAnyTime (this);" >
<option value="6" >Qualsiasi orario</option>
<option value="0" >00:00</option>
<option value="1" >01:00</option>
<option value="2" >02:00</option>
<option value="3" >03:00</option>
<option value="4" >04:00</option>
<option value="5" >05:00</option>
<option value="6" >06:00</option>
<option value="7" >07:00</option>
<option value="8" >08:00</option>
<option value="9" >09:00</option>
<option value="10" >10:00</option>
<option value="11" >11:00</option>
<option value="12" >12:00</option>
<option value="13" >13:00</option>
<option value="14" >14:00</option>
<option value="15" >15:00</option>
<option value="16" >16:00</option>
<option value="17" >17:00</option>
<option value="18" >18:00</option>
<option value="19" >19:00</option>
<option value="20" >20:00</option>
<option value="21" >21:00</option>
<option value="22" >22:00</option>
<option value="23" >23:00</option>
</select>
</td>
<td>
<input type="hidden" name="outampm" value="" >
</td>
<td>
<input type="hidden" name="outlinkedDates" value="" disabled="disabled" >
<script type="text/javascript">
/* <![CDATA[ */
$(document).ready( function () {
//---------------------------------------
wiresJS.outCalendarJS=new Object();
wiresJS.getForm().each( function () {
if (wiresJS.outCalendarJS.month == undefined ) {
wiresJS.outCalendarJS.month = this.outmonth;
wiresJS.outCalendarJS.day = this.outday;
wiresJS.outCalendarJS.year = this.outyear;
wiresJS.outCalendarJS.linkedDates = this.outlinkedDates;
}
} ); 
//init some vars and attach change method to months
$(wiresJS.outCalendarJS.month).change( function() 
{ 
wiresJS.getMonth('ret').val( $(this).val() );
rebuildDays('ret', 2, 2012);
} );
wiresJS.outGetCalendarContent = function() {
return $(wiresJS.outCalendarJS.linkedDates);
}
wiresJS.outGetYear = function() {
return $(wiresJS.outCalendarJS.year);
}
wiresJS.outGetCalendarContent().datepicker( {
minDate: new Date(2012, 2, 25),
maxDate: new Date(2013, 2, 24),
yearRange: '2012:2013',
beforeShow: outreadLinked,
onSelect: outupdateLinked,
dateFormat: 'm-d-yy',
buttonImage: 'http://www.travelstoremaker.com/homes-ibe/mondoviaggi/nui/images/calendar.gif',
buttonImageOnly: true,
showOn: 'button'
} ); 
// Prepare to show a date picker linked to three select controls 
function outreadLinked () {
var month= wiresJS.outCalendarJS.month.value;
var day = wiresJS.outCalendarJS.day.value;
var year = wiresJS.outCalendarJS.year;
if (year==undefined) {
year = wiresJS.getYear(2012, 2, 25, month, day);
}
else {
year = year.value;
}
var actual_date = 
(parseInt(month)+1) + '-' + 
day + '-' + year;
//alert(actual_date);
wiresJS.outGetCalendarContent().val(actual_date); 
return {}; 
} 
// Update three select controls to match a date picker selection 
function outupdateLinked (date) { 
if (date == '') return; 
var OptionValue=date;
var date_array = OptionValue.split("-");
var month = parseInt(date_array[0])-1;
var day = date_array[1];
var year = date_array[2];
var month_obj = $(wiresJS.outCalendarJS.month);
month_obj.val(month); 
month_obj.change();
$(wiresJS.outCalendarJS.day).val(day);
if (undefined!=wiresJS.outCalendarJS.year)
wiresJS.outGetYear ().val(year);
} 
//---------------------------------------
//---------------------------------------
wiresJS.retCalendarJS=new Object();
wiresJS.getForm().each( function () {
if (wiresJS.retCalendarJS.month == undefined ) {
wiresJS.retCalendarJS.month = this.retmonth;
wiresJS.retCalendarJS.day = this.retday;
wiresJS.retCalendarJS.year = this.retyear;
wiresJS.retCalendarJS.linkedDates = this.retlinkedDates;
}
} ); 
//init some vars and attach change method to months
$(wiresJS.retCalendarJS.month).change( function() 
{ 
} );
wiresJS.retGetCalendarContent = function() {
return $(wiresJS.retCalendarJS.linkedDates);
}
wiresJS.retGetYear = function() {
return $(wiresJS.retCalendarJS.year);
}
wiresJS.retGetCalendarContent().datepicker( {
minDate: new Date(2012, 2, 25),
maxDate: new Date(2013, 2, 24),
yearRange: '2012:2013',
beforeShow: retreadLinked,
onSelect: retupdateLinked,
dateFormat: 'm-d-yy',
buttonImage: 'http://www.travelstoremaker.com/homes-ibe/mondoviaggi/nui/images/calendar.gif',
buttonImageOnly: true,
showOn: 'button'
} ); 
// Prepare to show a date picker linked to three select controls 
function retreadLinked () {
var month= wiresJS.retCalendarJS.month.value;
if (wiresJS.retCalendarJS.day.value == ''){
var day = wiresJS.outCalendarJS.day.value;
}else{
var day = wiresJS.retCalendarJS.day.value;
}
var year = wiresJS.retCalendarJS.year;
if (year==undefined) {
year = wiresJS.getYear(2012, 2, 25, month, day);
}
else {
year = year.value;
}
var actual_date = 
(parseInt(month)+1) + '-' + 
day + '-' + year;
//alert(actual_date);
wiresJS.retGetCalendarContent().val(actual_date); 
return {}; 
} 
// Update three select controls to match a date picker selection 
function retupdateLinked (date) { 
if (date == '') return; 
var OptionValue=date;
var date_array = OptionValue.split("-");
var month = parseInt(date_array[0])-1;
var day = date_array[1];
var year = date_array[2];
var month_obj = $(wiresJS.retCalendarJS.month);
month_obj.val(month); 
month_obj.change();
$(wiresJS.retCalendarJS.day).val(day);
if (undefined!=wiresJS.retCalendarJS.year)
wiresJS.retGetYear ().val(year);
} 
//---------------------------------------
} ); //end of document.ready
/* ]]> */
</script>
</td></tr></table></td>
<td width="50%" align="left">
<table style="width: auto;">
<tr>
<td>

<span class=" EmphasizedText Text InlineBox" >Ritorno</span></td>
<td>
<span class=" EmphasizedText Text InlineBox" >Data</span></td>
<td>
<span class=" EmphasizedText Text InlineBox" >Orario</span></td>
</tr>
<tr>
<td>

<select name="retday" >
<option value="" selected="selected" ></option>
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
<option value="7" >7</option>
<option value="8" >8</option>
<option value="9" >9</option>
<option value="10" >10</option>
<option value="11" >11</option>
<option value="12" >12</option>
<option value="13" >13</option>
<option value="14" >14</option>
<option value="15" >15</option>
<option value="16" >16</option>
<option value="17" >17</option>
<option value="18" >18</option>
<option value="19" >19</option>
<option value="20" >20</option>
<option value="21" >21</option>
<option value="22" >22</option>
<option value="23" >23</option>
<option value="24" >24</option>
<option value="25" >25</option>
<option value="26" >26</option>
<option value="27" >27</option>
<option value="28" >28</option>
<option value="29" >29</option>
<option value="30" >30</option>
<option value="31" >31</option>
</select>
</td>
<td>
<select name="retmonth" id="retmonth" >
<option value="0" >Gennaio</option>
<option value="1" >Febbraio</option>
<option value="2" >Marzo</option>
<option value="3" >Aprile</option>
<option value="4" >Maggio</option>
<option value="5" >Giugno</option>
<option value="6" >Luglio</option>
<option value="7" >Agosto</option>
<option value="8" >Settembre</option>
<option value="9" >Ottobre</option>
<option value="10" >Novembre</option>
<option value="11" >Dicembre</option>
</select>
</td>
<td>
<select name="rethour" onchange="if (wiresJS.selectAnyTime) wiresJS.selectAnyTime (this);" >
<option value="6" >Qualsiasi orario</option>
<option value="0" >00:00</option>
<option value="1" >01:00</option>
<option value="2" >02:00</option>
<option value="3" >03:00</option>
<option value="4" >04:00</option>
<option value="5" >05:00</option>
<option value="6" >06:00</option>
<option value="7" >07:00</option>
<option value="8" >08:00</option>
<option value="9" >09:00</option>
<option value="10" >10:00</option>
<option value="11" >11:00</option>
<option value="12" >12:00</option>
<option value="13" >13:00</option>
<option value="14" >14:00</option>
<option value="15" >15:00</option>
<option value="16" >16:00</option>
<option value="17" >17:00</option>
<option value="18" >18:00</option>
<option value="19" >19:00</option>
<option value="20" >20:00</option>
<option value="21" >21:00</option>
<option value="22" >22:00</option>
<option value="23" >23:00</option>
</select>
</td>
<td>
<input type="hidden" name="retampm" value="" >
</td>
<td>
<input type="hidden" name="retlinkedDates" value="" disabled="disabled" >
</td>
</tr>
</table>
</td>
</tr>
</table>

Grazie mille anticipatamente

**br1** · 26-03-2012, 18:03

<body onload="d=new Date(); document.getElementById('outday').selectedIndex=d. getDate()-1; document.getElementById('outmonth').selectedIndex= d.getMonth();">

Poi le istruzioni funzionanti dipendono dal resto della pagina... ovvero se sono presenti altri gestori dell'evento onload.

ciao

**itanic80** · 26-03-2012, 18:08

ehm..so troppo ignorante in materia di javascript, dove devo inserire quel codice?

**br1** · 26-03-2012, 18:09

Originariamente inviato da br1
<body onload="d=new Date(); document.getElementById('outday').selectedIndex=d. getDate()-1; document.getElementById('outmonth').selectedIndex= d.getMonth();">

**itanic80** · 26-03-2012, 18:12

scusa, non avevo letto bene il codice, l'ho messo e funziona per il outday e outmonth
come devo fare anche per il retday e il retmonth?
grazie infinite

**itanic80** · 26-03-2012, 18:29

Ho provato a fare così

codice:

<script language="javascript" type="text/javascript">
<!-- 
function funzione1(){
d=new Date(); document.getElementById('outday').selectedIndex=d.getDate()-1; document.getElementById('outmonth').selectedIndex=d.getMonth();

    }
function funzione2(){
d=new Date(); document.getElementById('retday').selectedIndex=d.getDate()-1; document.getElementById('retmonth').selectedIndex=d.getMonth();
    }


function avvio(){

    funzione1();
    funzione2();
    }

 -->
</script>

<body onload="avvio();">

ma il secondo campo, quello relativo alla data di ritorno, non funziona...cioè non si aggiorna con la data attuale...
come posso fare?

Discussione: autocompletamento campo select per giorno e mese attuale

Strumenti discussione

Ricerca discussione

Visualizza

autocompletamento campo select per giorno e mese attuale

Permessi di invio