onChange dans un <select>

Version imprimable

01/01/2010, 18h28
shootingcoco

onChange dans un <select>
Bonjours à tous et bonne année,

Voilà j'ai un problème sans doute très simple pour vous :

Dans un <select> j'ai plusieurs <option>, je veux qu'en changeant d'option cela exécute la fonction que j'ai créer qui s'appelle change() .
Code:

1 2 3 4 5 6 <select onChange="change();"> <option value="1">1ère option</option> <option value="2">2ème option</option> </select>
Mon problème est que je veux rajouter la valeur de l'option choisie juste après "change" pour que ça exécute change2() en choisissant l'option 2, et change1() en choisissant l'option 1 etc ...

Merci pour vos réponses
01/01/2010, 18h46
xess91

Salut,

Peux-tu envoyer ton script javascript et html juste la fonction change() et les selects ?

Merci.:D

Bonsoir.

Essaye avec cela :
Code:

1 2 3 4 5 6 <select> <option onChange="change(this.value)" value="1">1ère option</option> <option onChange="change(this.value)" value="2">2ème option</option> </select>
Tu pourras ainsi passer la valeur de l'option sélectionné en paramètre de ta fonction change()....

A l'intérieur de celle-ci tu fais une petite condition :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 function change(param) { if (param == 1) { new function() { /* ton code de la fonction change1 */ } } else if (param == 2) { new function() { /* ton code de la fonction change2 */ } } ....
Voilà, encore faut-il que je voie comment sont écrites tes fonctions change1() et change2(), car là on imbrique plusieurs fonctions.

wILL

Non l'option n'accepte pas l'evènement onchnage qui doit rester sur la balise select

Il faut passer la value et faire un aiguillage:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
 
<select onChange="change(this.value);">
 
	<option value="1">1ère option</option>
	<option value="2">2ème option</option>  
 
</select>
 
function change(val){
          switch (val){
                            case 1 : change1();
                                        break;
                            case 2 : change2();
                                        break;
                           }
}

01/01/2010, 19h05
will74

Autant pour moi SpaceFrog.
Et c'est vrai que le switch est mieux pensé qu'une bête structure conditionelle :ccool:

Énorme merci pour la rapidité de vos réponses.

Ma fonction change() me sert à modifier la value="" d'un <input> dans le même formulaire.

Suite à vos réponses j'ai essayé le code suivant :

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
 
<form name='formulaire'>
 
<input type="text" name="champs" value="1" />
 
<select onChange="change(this.value);">
	<option value="1">1ère option</option>
	<option value="2">2ème option</option>  
</select>
 
<input type="submit" />
 
</form>
 
<script type="text/javascript">
function change(param){
          switch (param){
                            case 1 : change1();
                                        break;
                            case 2 : change2();
                                        break;
                           }
}
 
function change1() {
    document.forms['formulaire'].champs.value="1";
}
 
function change2() {
    document.forms['formulaire'].champs.value="2";
}
</script>

Voilà et ça ne marche pas.

Pourquoi tu ne fairais pas ça :

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
 
<html>
<head>
<script type="text/javascript">
function change(param){
	var valeur;
	valeur = document.getElementById(param).value;
	if(valeur == 1){ change1(); }
	if(valeur == 2){ change2(); }
}
 
function change1() {
    document.getElementById('champs').value = "1";
}
 
function change2() {
    document.getElementById('champs').value = "2";
}
</script>
</head>
<body>
 
<form name='formulaire'>
 
<input type="text" id="champs" name="champs" value="1" />
 
<select id='selection' onChange="change('selection');">
	<option value="">Choisissez une option</option>
	<option value="1">1ère option</option>
	<option value="2">2ème option</option>  
</select>
 
<input type="submit" />

ou alors sur la même structure que les autres ton proposés :

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
 
<html>
<head>
<script type="text/javascript">
function change(param){
    switch (param){
        case '1' : change1();
                    break;
        case '2' : change2();
                    break;
		}
	}
 
function change1() {
    document.formulaire.champs.value="1";
}
 
function change2() {
    document.formulaire.champs.value="2";
}
</script>
</head>
<body>
 
<form name='formulaire'>
 
<input type="text" name="champs" value="1" />
 
<select id='selection' onChange="change(this.value);">
	<option value="">Choisissez une option</option>
	<option value="1">1ère option</option>
	<option value="2">2ème option</option>  
</select>
 
<input type="submit" />
 
</form>

01/01/2010, 20h16
shootingcoco

Super ça marche très bien.
01/01/2010, 20h32
SpaceFrog

sinon plus directement

Code:

<select onchange="document.formulaire.champs.value=this.value">
01/01/2010, 20h36
xess91

oui encore mieux si tes besoins se résument qu'a cette action.:ccool:

pourquoi faire simple quand on peut faire compliqué...mdr