script sur Internet explorer

Version imprimable

Bonjour.
Mon script fonctionne trés bien sur firefox, par contre aucune réactivité sur IE c'est comme figé. Bizarrement le navigateur (IE) ne signal aucune erreur (contrairment à ce qu'il fait d'accoutumé en présence d'erreur de syntaxe)...

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title> Bienvenu</title>
<meta http-equiv="Content-type" Content="text/html; charser=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="css" href ="formulaire.css"/>
<script language="JavaScript" type="text/javascript"> 
var code="E01";
var consommation="Appareil";
var methode="P_T";
function test(x,y,z)
{if (x)
{code=x;}
if (y)
{consommation=y;}
if (z)
{methode=z;}
if (consommation=="Installation")
document.getElementById("Choix_données").style.display="block";
else
document.getElementById("Choix_données").style.display="none";
if (code=="E01")
   {if (methode=="P_T" || consommation=="Appareil")
   {document.getElementById("B_P_T").style.display="block";
   document.getElementById("1_Tranche").style.display="block";
   document.getElementById("3_Tranche").style.display="none";
   document.getElementById("B_R_D_C").style.display="none";}
   if (methode=="R_D_C" && consommation=="Installation")
   {document.getElementById("B_R_D_C").style.display="block";
   document.getElementById("1R").style.display="block";
   document.getElementById("3R").style.display="none";
   document.getElementById("B_P_T").style.display="none";}
   }
if (code=="E41")
   {if (methode=="P_T" || consommation=="Appareil")
   {document.getElementById("B_P_T").style.display="block";
   document.getElementById("3_Tranche").style.display="block";
   document.getElementById("1_Tranche").style.display="none";
   document.getElementById("B_R_D_C").style.display="none";}
   if (methode=="R_D_C" && consommation=="Installation")
   {document.getElementById("B_R_D_C").style.display="block";
   document.getElementById("3R").style.display="block";
   document.getElementById("1R").style.display="none";
   document.getElementById("B_P_T").style.display="none";}
   }
   }
 
   </script>
</head>
<body>
 
<form name="form" method="post" action="traitement.php">
<p>
<label for="Code">Code de votre Tarif </label> : 
<select name="Code" id="Code">
<option value="E01" selected="selected" onclick='test(this.value,"","")'>E01</option>
<option value="E41" onclick='test(this.value,"","")'>E41</option>
</select>
</p>
 
<p>
<label>Consommation : </label> 
<select name="Consommation" id="Consommation">
<option value="Appareil" selected="selected" onclick='test("",this.value,"")'>D'un appareil</option>
<option value="Installation" onclick='test("",this.value,"")'>D'une installation</option>
</select>
</p>
 
<div id="Choix_données" style="display:none">
<p>
Données :<br\>
Calculer votre facture à partir des :</p>
<p>
<input type="radio" name="methode" onclick='test("","",this.value)' value="P_T" id="P_T" /> <label for="P_T">Puissances et Temps de fonctionnements</label>
<input type="radio" name="methode" onclick='test("","",this.value)' value="R_D_C" id="R_D_C" /> <label for="R_D_C">Relevés de compteur</label>
</p>
</div>
 
<div>
<div id="B_P_T">
<p>
<label for="puissance" style="padding-right:20px";>Puissance (kW) : </label>  <input type="text" name="P" id="puissance" value=""/>
</p>
 
<p id="1_Tranche">
<label for="Temps_de_fonctionnment">Temps de fonctionnment (en heures) </label> : <input type="text" name="Temps_de_fonctionnment" id="Temps_de_fonctionnment" value=""/>
</p>
 
<div id="3_Tranche" style="display:none">
<p id="tps">Temps de fonctionnement (en heures) : </p>
<ul>
<li><label for="H_Cr" >Heures de creuse : </label>  <input type="text" name="H_Cr" id="H_Cr" value=""/></li>
<li><label for="H_Pt" style="padding-right:2px">Heures de pointe : </label>  <input type="text" name="H_Pt" id="H_Pt" value=""/></li>
<li><label for="H_Pl" style="padding-right:23px">Heures pleine : </label>  <input type="text" name="H_Pl" id="H_Pl" value=""/></li>
</ul>
<p>
<label for="phi">Facteur de puissance tg(&phi) </label> : <input type="text" name="phi" id="phi"/>
</p>
</div>
</div>
 
<div id="B_R_D_C" style="display:none">
 
<div id="1R">
<p>
<label for="N_R">Nouveau relevé </label> : <input type="text" name="N_R" id="N_R"/>
<br/>
<label for="A_R" class="label_A_R">Ancien relevé</label> : <input type="text" name="A_R" id="A_R" />
</p>
</div>
 
<div id="3R">
  <div><strong>Energie Active :</strong></div>
  <div style="padding-left:18px">
     <div class="cadran">Cadran creuse : 
     </div>
     <p>
     <label for="N_R_Cr">Nouveau relevé </label> : <input type="text" name="N_R_Cr" id="N_R_Cr"/>
     <br/>
     <label for="A_R_Cr" class="label_A_R">Ancien relevé </label> : <input type="text" name="A_R_Cr" id="A_R_Cr" />
     </p>
     <div class="cadran">Cadran pointe : 
     </div>
     <p>
     <label for="N_R_Pt">Nouveau relevé </label> : <input type="text" name="N_R_Pt" id="N_R_Pt"/>
     <br/>
     <label for="A_R_Pt" class="label_A_R">Ancien relevé</label> : <input type="text" name="A_R_Pt" id="A_R_Pt" />
     </p>
     <div class="cadran">Cadran pleine : 
     </div>
     <p>
     <label for="N_R_Pl">Nouveau relevé </label> : <input type="text" name="N_R_Pl" id="N_R_Pl"/>
     <br/>
     <label for="A_R_Pl" class="label_A_R" >Ancien relevé</label> : <input type="text" name="A_R_Pl" id="A_R_Pl" />
     </p>
   </div>
 
   <div><strong>Energie reactive :</strong></div>
     <p style="padding-left:128px">
     <label for="N_R_Rea">Nouveau relevé </label> : <input type="text" name="N_R_Rea" id="N_R_Rea" />
     <br/>
     <label for="A_R_Rea" class="label_A_R">Ancien relevé </label> : <input type="text" name="A_R_Rea" id="A_R_Rea" />
     </p>
   <div><strong>Puissance maximale atteinte :</strong></div>
     <p style="padding-left:128px">
     <label for="pma">Relevé </label> : <input type="text" name="pma" id="pma" />
     </p>
 
</div>
</div>
</div>
 
<input type="submit" value="Valider"/>
</form>
</body>
</html>

?

Merci.

15/10/2010, 15h26
SpaceFrog
c'est une nouvelle mode de mettre les accolades à al ligne ???
Code:

1 2 3 4 5 6 function foo(){ } if(condition){ }

Citation:

Envoyé par Medde

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
39
40
41
42
43
44
45
46
47
48
49
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title> Bienvenu</title>
<meta http-equiv="Content-type" Content="text/html; charser=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="css" href ="formulaire.css"/>
<script language="JavaScript" type="text/javascript"> 
var code="E01";
var consommation="Appareil";
var methode="P_T";
function test(x,y,z){
if (x){
code=x;}
if (y){
consommation=y;}
if (z){
methode=z;}
if (consommation=="Installation")
document.getElementById("Choix_données").style.display="block";
else
document.getElementById("Choix_données").style.display="none";
if (code=="E01"){
   if (methode=="P_T" || consommation=="Appareil"){
   document.getElementById("B_P_T").style.display="block";
   document.getElementById("1_Tranche").style.display="block";
   document.getElementById("3_Tranche").style.display="none";
   document.getElementById("B_R_D_C").style.display="none";}
   if (methode=="R_D_C" && consommation=="Installation"){
   document.getElementById("B_R_D_C").style.display="block";
   document.getElementById("1R").style.display="block";
   document.getElementById("3R").style.display="none";
   document.getElementById("B_P_T").style.display="none";}
   }
if (code=="E41"){
   if (methode=="P_T" || consommation=="Appareil"){
   document.getElementById("B_P_T").style.display="block";
   document.getElementById("3_Tranche").style.display="block";
   document.getElementById("1_Tranche").style.display="none";
   document.getElementById("B_R_D_C").style.display="none";}
   if (methode=="R_D_C" && consommation=="Installation"){
   document.getElementById("B_R_D_C").style.display="block";
   document.getElementById("3R").style.display="block";
   document.getElementById("1R").style.display="none";
   document.getElementById("B_P_T").style.display="none";}
   }
   }
 
   </script>
</head>

ça ne fonctionne pas!

15/10/2010, 15h51
vermine
SpaceFrog, personnellement on m'a appris à faire ainsi :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 function nom() { //code if() { //code } //code }
Comme ça, j'ai l'ouverture et la fermeture sur une même ligne et je peux vérifier aisément que j'ai bien fermé tout ce que j'ai ouvert.
15/10/2010, 15h55
SpaceFrog
Code:

1 2 3 4 5 6 7 8 9 function nom(){ //code if() { //code } //code }
là aussi tu as la parenthèse fermante qui est relié à la ligne de création de fonction
15/10/2010, 15h56
Medde

Citation:

Envoyé par vermine

Comme ça, j'ai l'ouverture et la fermeture sur une même ligne et je peux vérifier aisément que j'ai bien fermé tout ce que j'ai ouvert.

Oui voila, c'est la maniére classique, j'ai essayé cela mais non:(
Peut être que ça ne vient pas des accolades...?
15/10/2010, 16h01
SpaceFrog

sans voir le html c'est difficile de dire ...

ça ne marche pas!

Citation:

Envoyé par Medde

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title> Bienvenu</title>
<meta http-equiv="Content-type" Content="text/html; charser=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="css" href ="formulaire.css"/>
<script language="JavaScript" type="text/javascript"> 
var code="E01";
var consommation="Appareil";
var methode="P_T";
function test(x,y,z)
{
if (x)
{
code=x;
}
if (y)
{
consommation=y;
}
if (z)
{
methode=z;
}
if (consommation=="Installation")
document.getElementById("Choix_données").style.display="block";
else
document.getElementById("Choix_données").style.display="none";
if (code=="E01")
   {
    if (methode=="P_T" || consommation=="Appareil")
   {
   document.getElementById("B_P_T").style.display="block";
   document.getElementById("1_Tranche").style.display="block";
   document.getElementById("3_Tranche").style.display="none";
   document.getElementById("B_R_D_C").style.display="none";
   }
   if (methode=="R_D_C" && consommation=="Installation")
   {
    document.getElementById("B_R_D_C").style.display="block";
   document.getElementById("1R").style.display="block";
   document.getElementById("3R").style.display="none";
   document.getElementById("B_P_T").style.display="none";
   }
   }
if (code=="E41")
   {
    if (methode=="P_T" || consommation=="Appareil")
   {
    document.getElementById("B_P_T").style.display="block";
   document.getElementById("3_Tranche").style.display="block";
   document.getElementById("1_Tranche").style.display="none";
   document.getElementById("B_R_D_C").style.display="none";
   }
   if (methode=="R_D_C" && consommation=="Installation")
   {
   document.getElementById("B_R_D_C").style.display="block";
   document.getElementById("3R").style.display="block";
   document.getElementById("1R").style.display="none";
   document.getElementById("B_P_T").style.display="none";
   }
   }
   }
 
   </script>
</head>

15/10/2010, 16h03
Medde

Citation:

Envoyé par SpaceFrog

sans voir le html c'est difficile de dire ...

J'ai fourni la page entiére sur mon premier message??
15/10/2010, 16h07
SpaceFrog

désolé, j'ai du prendre le post en route :oops:

ne cherche plus une option n'accepte pas de onclick !

il faut passer par le onchange du select

Comme ceci:

Code:

1
2
3
4
5
6
7
 
<p>
<label>Consommation : </label> 
<select name="Consommation" id="Consommation">
<<option value="Installation" onchange='test("",document.getElementById("Consommation").options[document.getElementById("Consommation").selectedIndex].value,"")'>D'une installation</option>
</select>
</p>

?
ça marche pas avec un this value?

15/10/2010, 16h20
SpaceFrog

Citation:

il faut passer par le onchange du select

... du select
pas de l'option
15/10/2010, 16h21
Air P-E
concernant l'histoire des accolades, chacun à sa manière et ça dépend aussi des langages... Les développeurs Java ont tendance à écrire
Code:

1 2 3 4 5 if (condition) { } else { }
Alors que les développeurs C# l'écriront plutôt ainsi
Code:

1 2 3 4 5 6 7 8 if (condition) { } else { }
(En fait c'est plus Visual Studio qui l'oblige... :mouarf:)

Sinon, entièrement d'accord avec SpaceFrog, tu ne peux pas spécifier de onclick sur une option mais en faisant
Code:

1 2 3 4 <SELECT id="txtChar" onchange="javascript: alert(this.value);" > <OPTION... /> <OPTION ... /> </SELECT>
Tu récupères la valeur de l'option cliqué. :ccool:

Il te suffit ensuite de faire une condition
Code:

1 2 3 4 if (document.getElementById('txtChar').value == '1') { // Faire tes actions ! } // Oui moi je fais à la manière Java ! :p
15/10/2010, 18h24
Medde
Citation:

Envoyé par SpaceFrog

... du select
pas de l'option

Oui bien sure désolé,

Code:

<select name="Code" onChange='test(this.form.elements["Code"].options[this.form.elements["Code"].selectedIndex].value,"","")>

:ccool:
Citation:
Envoyé par Air P-E

Sinon, entièrement d'accord avec SpaceFrog, tu ne peux pas spécifier de onclick sur une option mais en faisant

Code:

1 2 3 4 <SELECT id="txtChar" onchange="javascript: alert(this.value);" > <OPTION... /> <OPTION ... /> </SELECT>

Tu récupères la valeur de l'option cliqué. :ccool:

Il te suffit ensuite de faire une condition

Code:

1 2 3 4 if (document.getElementById('txtChar').value == '1') { // Faire tes actions ! } // Oui moi je fais à la manière Java ! :p
Intéressant!
Et dans mon cas Air P-E ; pour transporter la variable dans ma fonction je comme ceci:
Code:

1 2 3 4 <SELECT id="txtChar" onchange='test("javascript: alert(this.value);","","")' > <OPTION... /> <OPTION ... /> </SELECT>
??

Merci à vous.
15/10/2010, 21h38
Air P-E
Citation:

Et dans mon cas Air P-E ; pour transporter la variable dans ma fonction je comme ceci:

Si tu souhaites passer plusieurs paramètres tu fais comme ceci :
Code:

1 2 3 4 5 <SELECT id="txtChar" onchange="javascript: maFonction(this.value, second_parametre, troisieme_parametre);" > <OPTION... /> <OPTION ... /> </SELECT>
Tu peux aussi appeler plusieurs fonctions différentes :
Code:

1 2 3 4 5 <SELECT id="txtChar" onchange="javascript: maFonction(this.value); uneAutreFonction();" > <OPTION... /> <OPTION ... /> </SELECT>
En générale j'évite de faire appel à plusieurs fonctions comme ça pour un soucis de lisibilité et puis bon il y a plus propre ! :lol: Mais ça fonctionne !

Un dernier petit point mais pas très important, en javascript on évite en générale d'utiliser les doubles quotes ( " ), guillemets quoi ! :aie: et préférer les simples quotes ( ' ), mais bon c'est pas ça qui va t'empêcher d'avoir un script qui fonctionne.

Bonsoir,

onchange attend déjà des instructions javascript donc inutile de mettre le motif "javascript: "
Code:

1 2 3 4 <select id="txtChar" onchange="maFonction(this.value, 'second_parametre', 'troisieme_parametre');" > <option value="1">texte1</option> <option value="2">texte2</option> </select>
A+.

15/10/2010, 22h43
Air P-E

Hem... Tu as tout a fait raison, j'avais même pas fait attention que je l'avais mit... Je me suis habitué à le mettre pour repérer d'un coup d'oeil ! :roll:
16/10/2010, 19h36
dukej

Citation:

Envoyé par Air P-E

Hem... Tu as tout a fait raison, j'avais même pas fait attention que je l'avais mit... Je me suis habitué à le mettre pour repérer d'un coup d'oeil ! :roll:

Eh bien tu peux te déshabituer immédiatement.

Citation:

Envoyé par andry.aime

Code:

1
2
3
4
<select id="txtChar" onchange="maFonction(this.value, 'second_parametre', 'troisieme_parametre');" >
    <option value="1">texte1</option>
    <option value="2">texte2</option>
</select>

:ccool:

Merci à tous!