[Javascript] Evènement à mettre sur les input radio

Répondre
Partager Rechercher
Bonjour Jol

J'ai fais mon petit script javascript qui doit changer un menu déroulant suivant le input radio coché.. Seulement, ça ne le fait pas :-/
Sur firefox, si je refresh il le change mais bon refresh à chaque fois c'est pas pratique...
Sur IE, si je refresh ça me remet le menu déroulant du début puisqu'il y a un radio en checked...

Donc ce que je recherche à faire c'est qu'il me change automatiquement le menu déroulant suivant le radio coché sans devoir faire un refresh..
Voici le code javascript
Code:
<script type="text/javascript">
window.onload=radioChande;
function radioChande() {
	if (document.getElementById('t50').checked){
		document.getElementById('tt100').style.display='none';
		document.getElementById('tt50').style.display='block';
	}
	else{
		document.getElementById('tt50').style.display='none';
		document.getElementById('tt100').style.display='block';
	}
}
</script>
J'ai essayer de mettre sur mes radio un évènement onChange et onClick, mais rien n'y fait.. ça ne change rien à mon problème :-/
Quel évènement dois-je mettre alors ?
Ou alors c'est un défaut dans mon script ? un oubli ?

Merci jol
À mettre après la définition de ta fonction
Code:
document.getElementById('Id_de_ton_select').addEventListener('change',radioChande,false);
(Ne marche que sur les navigateurs récents si je me souviens bien...)
faut te dire que javascript est quasiment fait pour IE, j'ai fais des script qui pourtant marchait niquel sur IE mais pas moyen sur firefox que sa tourne, je suis un gros noob et j'y connais pas grand chose mais sa marchais jamais.
Disons que... euh... j'ai deux select :d
Sous cette forme là :
Code HTML:
<select id='tt50' name='nbr'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
<select id='tt100' name='nbr'>
<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>
</select>
Et avec ton code je dois mettre l'id du select.. Là vient le problème puisque j'en ai deux :-/

Au départ je voulais mettre les id sur les options mais je ne sais pas comment gerer les tableaux en javascript (je suis très débutant en javascript ^^)
Je viens de recupérer tes bouts de code, et j'ai ajouté 2 boutons radio pour tester, le code donne ça (oui c'est du porc mais c'est pour tester vite fais j'ai faim ) :
Code:
<input type=radio id="t50" name=machin checked onClick="javascript:radioChande();">
<input type=radio id="t51" name=machin onClick="javascript:radioChande();">

<select id='tt50' name='nbr'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
<select id='tt100' name='nbr'>
<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>
</select>

<script type="text/javascript">
window.onload=radioChande;
function radioChande() {
	if (document.getElementById('t50').checked){
		document.getElementById('tt100').style.display='none';
		document.getElementById('tt50').style.display='block';
	}
	else{
		document.getElementById('tt50').style.display='none';
		document.getElementById('tt100').style.display='block';
	}
}
</script>
J'ai pas touché aux selects, ni au javascript, j'ai juste mis les 2 boutons radio... et ca marche sous IE (6) et Firefox (1.0.6)

En gros ton problème doit etre dans tes boutons radio... tu peux me faire voir comment tu les as fait ?

Précision :
J'ai mis le javascript à la fin, parce que quand un JS manipule des éléments de formulaire je le met toujours à la fin, au cas ou ce con décide d'exécuter le machin avant que tout ne soit chargé (j'ai une confiance et une connaissance limité en javascript du coup je prend des précautions vu que y'aura toujours autre chose qui va merder )
La seule différence entre tes radio et les mien sont pour le checked...

Pour être valide xhtml, je met checked='ckecked'.. Je vais voir si en faisant la façon barbare, j'y arrive ou pas

//édit : Ah nan mdr je n'avais mit que javascript: dans le lien que d'un seul radio :-/ Donc ça fonctionne parfaitement maintenant
Nan j'ai édité, ça marche.. Juste un oubli débile ^^

Par contre, etc-ce possible que la propriété window.onload déconne s'il y a plusieurs fois des chargements ?
Je veux dire que j'ai 2 scripts java avec cette propriété : window.onload=montre; et window.onload=radioChange;

Mais lorsque je vais sur la page où radioChange s'execute, il semblerait que la fonction montre ne fonctionne plus :-/
J'ai pas tout compris là (ça en particulier : "lorsque je vais sur la page où radioChange s'execute")

ça sera p'tet plus clair avec un bout de code ?
Citation :
Publié par Tommy Wyhh
Et avec ton code je dois mettre l'id du select.. Là vient le problème puisque j'en ai deux :-/
Bon ça à l'air d'être réglé, mais pour info, suffisait de répéter la ligne pour les deux selects...



Geek, je pense que tu as fait un lapsus : IE a d'énormes lacunes en Javascript. (Par exemple, je pense que le code que j'ai donné ne marche pas sur ce vieux navigateur...). Et IE7 n'a pas l'air, pour l'instant, de corriger ces bugs...
Répondre

Connectés sur ce fil

 
1 connecté (0 membre et 1 invité) Afficher la liste détaillée des connectés