Récupérer des valeurs lors d'un onSubmit()

Version imprimable

Bonjour à tous,

J'aimerais récupérer deux valeurs d'un formulaire lors de l'évènement onSubmit(), pour les injecter comme paramètres dans la fonction javascript loadcalandar(month,year).

J'ai utiliser :

Code:

this.month.value

pour le champ month

et

Code:

this.year.value

pour le champ year.

mais en retour je n'ai que des valeurs vides :calim2:

Citation:

loadCalendar("","");

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<?php	
	// define array
	$montharray = array('', 'January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'); 
 
 
	function years($selected=''){
		$yearslist = "<select size='1' name='year'>";
		for ( $y=1970; $y <2022; $y++ ){
			if($selected == $y) $yearslist .= "<option selected value='$y'>$y</option>";
			else $yearslist .= "<option value='$y'>$y</option>";
		}
		$yearslist .= "</select>";
		return $yearslist;
	}
 
 
	function months($selected='',$montharray){
		$monthslist = "<select size='1' name='month'>";
		for ( $m=1; $m <13; $m++ ){
			if($selected == $m) $monthslist .= "<option selected value='$m'>$montharray[$i]</option>";
			else $monthslist .= "<option value='$m'>$montharray[$i]</option>";
		}
		$monthslist .= "</select>";
		return $monthslist;
	}
 
	funcion printout(){
 
		$output ='<div id="select_date">';
		$output .='<form name="selectmonthyear" action=""/>';
		$output .= months(date('n'));
		$output .= years(date('Y'));
		$output .='<input type="submit" onSubmit="loadCalendar(\"this.month.value\",\"this.year.value\");return false;" value="Go"/>';
		$output .='</form></div>';
	}	
 
	printout();
?>

13/11/2010, 11h10
SpaceFrog

si ton element possède un id ...

Code:

document.getElementById('idchamp').value

si il a un name

tu peux passer soit par la collection

Code:

document.getElementsByName('nomchamps')

soit par le formulaire

Code:

document.forms['nomform'].elements['nomchamps']
13/11/2010, 11h49
apt

J'ai modifié le code ainsi :

Code:

$output ='<form name="selectmonthyear" action="" onSubmit="loadCalendar(document.getElementById(\'month\').value.value,document.getElementsById(\'year\').value);return false;" />';

en retour j'ai :

Citation:

<form onsubmit="loadCalendar(document.getElementById('month').value.value,document.getElementsById('year').value);return false;" action="" name="selectmonthyear">

les valeurs ne sont pas récupérés....

peut-être une faute d'écriture des paramètres de la fonction ?
13/11/2010, 13h24
SpaceFrog

Code:

document.getElementById('month').value.value

value.value ???
il ne me semble pas avoir ecrit une telle horreur
14/11/2010, 10h02
apt

Citation:

Envoyé par SpaceFrog

Code:

document.getElementById('month').value.value

value.value ???
il ne me semble pas avoir ecrit une telle horreur

Excuses ! erreur de frappe :mrgreen:

mais même pour le deuxiéme paramètre 'year', je n'ai rien en retour.
14/11/2010, 10h31
SpaceFrog

tes selects ont des id ???
14/11/2010, 10h35
apt

Citation:

Envoyé par SpaceFrog

tes selects ont des id ???

Oui je les ai ajouté;

id="month" pour le mois et id="year" pour l'année.

un petit exemple fonctionnel vaut mieux qu'une chasse au bug ...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<script type="text/javascript">
function bar(){
mois=document.getElementById('month').value
annee=document.getElementById('year').value
alert("votre selection :\nmois: "+mois+"\nannée: "+annee)
return false;
}
</script>
</head>
 
<body>
<form action="" name="foo" onsubmit="bar()" >
<select id="month">
<option value='janvier'>01</option>
<option value='fevrier'>02</option>
<option value='mars'>03</option>
<option value='avril'>04</option>
<option value='mai'>05</option>
<option value='juin'>06</option>
<option value='juillet'>07</option>
<option value='aout'>08</option>
</select>
<select id="year">
<option value='90'>1990</option>
<option value='91'>1991</option>
<option value='92'>1992</option>
<option value='93'>1993</option>
</select>
<input type="submit" value="go" />
</form>
 
 
</body>

14/11/2010, 11h10
apt

Il n'y a pas moyen d'injecter directement les valeurs dans les paramètres de ma fonction ?

À noter que la fonction loadcalendar($month,$year) est écrit en jQuery.

elle est ou cette fonction ? et elle fait quoi

sinon sur le principe de base oui biensur on peut

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<script type="text/javascript">
function bar(mois, annee){
alert("votre selection :\nmois: "+mois+"\nannée: "+annee)
return false;
}
</script>
</head>
 
<body>
<form action="" name="foo" onsubmit="bar(document.getElementById('month').value,document.getElementById('year').value)" >
<select id="month">
<option value='janvier'>01</option>
<option value='fevrier'>02</option>
<option value='mars'>03</option>
<option value='avril'>04</option>
<option value='mai'>05</option>
<option value='juin'>06</option>
<option value='juillet'>07</option>
<option value='aout'>08</option>
</select>
<select id="year">
<option value='90'>1990</option>
<option value='91'>1991</option>
<option value='92'>1992</option>
<option value='93'>1993</option>
</select>
<input type="submit" value="go" />
</form>
 
 
</body>
 
</html>

Citation:

Envoyé par SpaceFrog

elle est ou cette fonction ? et elle fait quoi

la voilà :

Code:

1
2
3
4
function loadCalendar(vmonth, vyear){
	$('#ajax-calendar').html('<div id="loading"><p><img src="ajax-loader.gif" alt="" /></p></div>');
	$.get("calendar.ajax.php",{month:vmonth,year:vyear},function(data){$('#ajax-calendar').html(data);});
}

14/11/2010, 15h26
apt

Citation:

Envoyé par SpaceFrog

elle est ou cette fonction ? et elle fait quoi

sinon sur le principe de base oui biensur on peut

Ton exemple fonctionne très bien, mais en appliquant ceci à mon cas, ça ne donne rien en retour !!!! 8O

En cliquant sur le bouton envoi, je reçois cette erreur, dans l'onglet Console de firebug :

document.getElementById is not a function
14/11/2010, 19h18
apt

C'était un "s" de superflu dans document.getElementsById

maintenant ça marche.

Merci SpaceFrog :ccool: