Sujet Précédent Sujet Suivant

[Javacript] Simplifier code avec des input

Fermé
charlaye Messages postés 71 Date d'inscription mercredi 4 octobre 2006 Statut Membre Dernière intervention 13 avril 2010 - 8 sept. 2008 à 16:35
charlaye Messages postés 71 Date d'inscription mercredi 4 octobre 2006 Statut Membre Dernière intervention 13 avril 2010 - 9 sept. 2008 à 11:08
Bonjour,
je cherche depuis un moment le moyen de simplifier ce script qui par ailleur marche très bien 

<script language="Javascript">
function griser()
{

var a11var = document.getElementById('a11');
var a12var = document.getElementById('a12');
var a13var = document.getElementById('a13');
var a21var = document.getElementById('a21');
var a22var = document.getElementById('a22');
var a23var = document.getElementById('a23');

if (a11var.checked) {a21var.disabled=true;a21var.checked=false;a22var.disabled=false;a23var.disabled=false;}
if (a12var.checked) {a22var.disabled=true;a22var.checked=false;a21var.disabled=false;a23var.disabled=false;}
if (a13var.checked) {a23var.disabled=true;a23var.checked=false;a21var.disabled=false;a22var.disabled=false;}
if (a21var.checked) {a11var.disabled=true;a11var.checked=false;a12var.disabled=false;a13var.disabled=false;}
if (a22var.checked) {a12var.disabled=true;a12var.checked=false;a11var.disabled=false;a13var.disabled=false;}
if (a23var.checked) {a13var.disabled=true;a13var.checked=false;a11var.disabled=false;a12var.disabled=false;}

}
</script>
<form method="post">
<input type="radio" name="a1" id="a11" onClick="griser()"><br>
<input type="radio" name="a1" id="a12" onClick="griser()"><br>
<input type="radio" name="a1" id="a13" onClick="griser()"><br>
<br>
<input type="radio" name="a2" id="a21" onClick="griser()"><br>
<input type="radio" name="a2" id="a22" onClick="griser()"><br>
<input type="radio" name="a2" id="a23" onClick="griser()"><br>
</form>


Plus précisément je cherche à ne pas mettre des tonnes de "if" et des tonnes de variables

merci d'avance pour vos suggestions !
A voir également:

2 réponses

Réponse 1 / 2
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
8 sept. 2008 à 21:37
regardes du côté des switch case
0
charlaye Messages postés 71 Date d'inscription mercredi 4 octobre 2006 Statut Membre Dernière intervention 13 avril 2010 13
9 sept. 2008 à 01:14
Merci alain_42 ! Je vais voir ça
0
charlaye Messages postés 71 Date d'inscription mercredi 4 octobre 2006 Statut Membre Dernière intervention 13 avril 2010 13
9 sept. 2008 à 02:09
j'ai regardé mais j'ai pas compris comment je peux utiliser les switch case pour simplifier mon code javascript
0
Réponse 2 / 2
charlaye Messages postés 71 Date d'inscription mercredi 4 octobre 2006 Statut Membre Dernière intervention 13 avril 2010 13
9 sept. 2008 à 02:14
Désolé d'insisté mais j'ai maintenant un code javascript vraiment très très gros
peut être qu'en vous montrant le gros code vous pourrez mieux m'aider à simplifier le tout
merci encore d'avance de vos réponses 

<script language="Javascript">
function griser() 
{

var a1var = document.getElementById('a1');
var a2var = document.getElementById('a2');
var a3var = document.getElementById('a3');
var a4var = document.getElementById('a4');
var a5var = document.getElementById('a5');

var b1var = document.getElementById('b1');
var b2var = document.getElementById('b2');
var b3var = document.getElementById('b3');
var b4var = document.getElementById('b4');
var b5var = document.getElementById('b5');

var c1var = document.getElementById('c1');
var c2var = document.getElementById('c2');
var c3var = document.getElementById('c3');
var c4var = document.getElementById('c4');
var c5var = document.getElementById('c5');

var d1var = document.getElementById('d1');
var d2var = document.getElementById('d2');
var d3var = document.getElementById('d3');
var d4var = document.getElementById('d4');
var d5var = document.getElementById('d5');

var e1var = document.getElementById('e1');
var e2var = document.getElementById('e2');
var e3var = document.getElementById('e3');
var e4var = document.getElementById('e4');

var f1var = document.getElementById('f1');
var f2var = document.getElementById('f2');
var f3var = document.getElementById('f3');
var f4var = document.getElementById('f4');

var g1var = document.getElementById('g1');
var g2var = document.getElementById('g2');
var g3var = document.getElementById('g3');

var h1var = document.getElementById('h1');
var h2var = document.getElementById('h2');
var h3var = document.getElementById('h3');

if (a1var.checked) {b1var.disabled=true;b2var.disabled=false;b3var.disabled=false;b4var.disabled=false;b5var.disabled=false;}
if (a2var.checked) {b2var.disabled=true;b1var.disabled=false;b3var.disabled=false;b4var.disabled=false;b5var.disabled=false;}
if (a3var.checked) {b3var.disabled=true;b1var.disabled=false;b2var.disabled=false;b4var.disabled=false;b5var.disabled=false;}
if (a4var.checked) {b4var.disabled=true;b1var.disabled=false;b2var.disabled=false;b3var.disabled=false;b5var.disabled=false;}
if (a5var.checked) {b5var.disabled=true;b1var.disabled=false;b2var.disabled=false;b3var.disabled=false;b4var.disabled=false;}

if (b1var.checked) {a1var.disabled=true;a2var.disabled=false;a3var.disabled=false;a4var.disabled=false;a5var.disabled=false;}
if (b2var.checked) {a2var.disabled=true;a1var.disabled=false;a3var.disabled=false;a4var.disabled=false;a5var.disabled=false;}
if (b3var.checked) {a3var.disabled=true;a1var.disabled=false;a2var.disabled=false;a4var.disabled=false;a5var.disabled=false;}
if (b4var.checked) {a4var.disabled=true;a1var.disabled=false;a2var.disabled=false;a3var.disabled=false;a5var.disabled=false;}
if (b5var.checked) {a5var.disabled=true;a1var.disabled=false;a2var.disabled=false;a3var.disabled=false;a4var.disabled=false;}

if (c1var.checked) {d1var.disabled=true;d2var.disabled=false;d3var.disabled=false;d4var.disabled=false;d5var.disabled=false;}
if (c2var.checked) {d2var.disabled=true;d1var.disabled=false;d3var.disabled=false;d4var.disabled=false;d5var.disabled=false;}
if (c3var.checked) {d3var.disabled=true;d1var.disabled=false;d2var.disabled=false;d4var.disabled=false;d5var.disabled=false;}
if (c4var.checked) {d4var.disabled=true;d1var.disabled=false;d2var.disabled=false;d3var.disabled=false;d5var.disabled=false;}
if (c5var.checked) {d5var.disabled=true;d1var.disabled=false;d2var.disabled=false;d3var.disabled=false;d4var.disabled=false;}

if (d1var.checked) {c1var.disabled=true;c2var.disabled=false;c3var.disabled=false;c4var.disabled=false;c5var.disabled=false;}
if (d2var.checked) {c2var.disabled=true;c1var.disabled=false;c3var.disabled=false;c4var.disabled=false;c5var.disabled=false;}
if (d3var.checked) {c3var.disabled=true;c1var.disabled=false;c2var.disabled=false;c4var.disabled=false;c5var.disabled=false;}
if (d4var.checked) {c4var.disabled=true;c1var.disabled=false;c2var.disabled=false;c3var.disabled=false;c5var.disabled=false;}
if (d5var.checked) {c5var.disabled=true;c1var.disabled=false;c2var.disabled=false;c3var.disabled=false;c4var.disabled=false;}

if (e1var.checked) {f1var.disabled=true;f2var.disabled=false;f3var.disabled=false;f4var.disabled=false;}
if (e2var.checked) {f2var.disabled=true;f1var.disabled=false;f3var.disabled=false;f4var.disabled=false;}
if (e3var.checked) {f3var.disabled=true;f1var.disabled=false;f2var.disabled=false;f4var.disabled=false;}
if (e4var.checked) {f4var.disabled=true;f1var.disabled=false;f2var.disabled=false;f3var.disabled=false;}

if (f1var.checked) {e1var.disabled=true;e2var.disabled=false;e3var.disabled=false;e4var.disabled=false;}
if (f2var.checked) {e2var.disabled=true;e1var.disabled=false;e3var.disabled=false;e4var.disabled=false;}
if (f3var.checked) {e3var.disabled=true;e1var.disabled=false;e2var.disabled=false;e4var.disabled=false;}
if (f4var.checked) {e4var.disabled=true;e1var.disabled=false;e2var.disabled=false;e3var.disabled=false;}

if (g1var.checked) {h1var.disabled=true;h2var.disabled=false;h3var.disabled=false;}
if (g2var.checked) {h2var.disabled=true;h1var.disabled=false;h3var.disabled=false;}
if (g3var.checked) {h3var.disabled=true;h1var.disabled=false;h2var.disabled=false;}

if (h1var.checked) {g1var.disabled=true;g2var.disabled=false;g3var.disabled=false;}
if (h2var.checked) {g2var.disabled=true;g1var.disabled=false;g3var.disabled=false;}
if (h3var.checked) {g3var.disabled=true;g1var.disabled=false;g2var.disabled=false;}

}
</script>
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
9 sept. 2008 à 10:29
Salut,

une piste , je n'ai pas testé, approfondis les array en JS, c'est un peu different de ceux en PHP mais c'est pratique, tu peux faire des boucles 

<script language="Javascript">
function griser() 
{
var array_list=new Array("a1","a2","a3","a4","a5","b1","b2", etc....,"f3");
//on va faire une deuxieme dimension a l'array_list pour avoir l'associé
array_list["a1"]=new Array("b1");
array_list["a2"]=new Array("b2");
//etc..
array_list["b1"]=new Array("a1");
//etc..

var array_checked=new Array();

for (i=0;i<array_list.length;i++){
	array_checked[array_list[i]] = document.getElementById(array_list[i]);
}
//tu te retrouve ainsi avec un array ayant  valeur correspondante true ou false, refletant l'état des boutons radio

//ensuite par une boucle sur l'array_list tu mets tous les radio checked false

//puis par une boucle sur l'array_checked 
for (var propriete in array_checked){
	if(array_checked[propriete]==true ){
		//on met checked true son associe celui de la 2 ieme dimension
		document.getElementById(array_list[propriete][0]).checked=true;
	}
}


}
0
charlaye Messages postés 71 Date d'inscription mercredi 4 octobre 2006 Statut Membre Dernière intervention 13 avril 2010 13 > Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017
9 sept. 2008 à 11:08
Merci encore pour tes coups de pouce alain_42

J'ai enfin terminé la version gros code de mon script et tout marche niquel
Mais je vais garder précieusement la piste que tu m'as donné histoire de m'entraîner aux boucles javascript (déjà que j'ai du mal avec celles du PHP) et peut-être un jour avoir une taille de fichier moins importante que celle que jai actuellement (25 ko ! mdr)
0

Discussions similaires

input signal out of range
marlene -
usman000 -

14 réponses
sertissage des cables rj45
lekludo -
brupala -

7 réponses
Code de renvoi d'appel : Ooredo, Mobilis...
midoou07 -
Camille -

13 réponses
Réinitialisation d'un téléphone mobile chinois avec touche
Nadjitam -
Papounet17000 -

1 réponse