IE : propriété display ou innerHTML impossible..

Version imprimable

Voir 40 message(s) de cette discussion en une page

20/10/2009, 11h38
kernelfailure

Curieux que ça poserait un problème de validation : Il ne s'agit que d'affichage.

Essaie avec .visibility='show' et .visibility='hide' à la place des display.

Vérifie que tes ids soient unique et aussi que tu n'aies pas d'erreur de syntax en amont de ton code en erreur. On ne sait jamais.

EDIT : 8O .visibility='visible' et .visibility='hidden'
:ccool: E.Bzz

donc j'ai testé 2 method :

en passant par le getElementById...
Code:

1 2 3 4 5 6 7 8 9 10 11 12 function check_test(test) { fields = document.getElementById("fields"); fieldsbis = document.getElementById("fieldsbis"); if(test == '05' || tes == '08') { fields.style.display = "none"; fieldsbis.style.display = "table-cell"; } else { fields.style.display = "table-cell"; fieldsbis.style.display = "none"; } }
=> ERREUR : Object doesn't support this property or method

et

en appelant directement l'element...
Code:

1 2 3 4 5 6 7 8 9 10 function check_test(test) { if(test == '05' || tes == '08') { fields.style.display = "none"; fieldsbis.style.display = "table-cell"; } else { fields.style.display = "table-cell"; fieldsbis.style.display = "none"; } }
=> ERREUR : Impossible d'obtenir la propriété display. Argument non valide.

sinon tout ça fonctionne sous FF et Chrome...

EDIT : je viens de lire l'astuce du visible, je peux pas l'utiliser ça ne convient pas à ma page, je ne peux pas me permettre de laisser un espace vide...

20/10/2009, 11h42
E.Bzz
Citation:

Envoyé par kernelfailure

Curieux que ça poserait un problème de validation : Il ne s'agit que d'affichage.

Il ne s'agit pas de validation mais d'interprétation par le nav ...

Citation:

Envoyé par kernelfailure

Essaie avec .visibility='show' et .visibility='hide' à la place des display.
Code:

1 2 3 visibility="visible" // ou visibility = "hidden"
:aie:

Mais ça ne réglera pas le problème ...

A+

fields et fieldsbis sont déclaré où ? Ce sont des variables globales ?
Si oui, vous mélangez global et local, pas bien.
Sinon, déclarez les explicitement dans la fonction (même si ça ne changera rien):
Code:

1 2 3 4 5 6 7 8 9 10 11 12 function check_test(test) { var fields = document.getElementById("fields"); var fieldsbis = document.getElementById("fieldsbis"); if(test == '05' || tes == '08') { fields.style.display = "none"; fieldsbis.style.display = "table-cell"; } else { fields.style.display = "table-cell"; fieldsbis.style.display = "none"; } }
Quant au visibility à la place du display, j'y ai pensé. Mais je n'ai plus IE6 donc pas moyen de vérifier...

20/10/2009, 11h45
E.Bzz

Tes 2 derniers codes ne pouvaient pas fonctionner (ne serai-ce qu'à cause du "tes == '8'").
Sinon, tu as essayé

Citation:

Envoyé par E.Bzz

il vaudrait mieux ne laisser qu'un seul td, avec tes 2 <table> à l'intérieur.
Suivant le cas, c'est ces tables contenues dans le <td> que tu masqueras ou afficheras.

??

A+
20/10/2009, 11h58
Darkroro

oui oui mon code est bâti comme ça maintenant... mon erreur est la même donc mais sur les elements <table> que je veux switch...

@Vermine : le problème de la propriété visibility c'est que ça laisse un trou à l'affichage...

@E.Bzz : erreur de transcryption vers le forum... c'est bien écrit dans mon code :?
20/10/2009, 12h00
E.Bzz

Citation:

Envoyé par Darkroro

mon erreur est la même donc mais sur les elements <table> que je veux switch...

Là par contre, il n'y a aucune raison ! :koi:

On peut voir (tout) le nouveau code ?

A+
20/10/2009, 12h03
vermine
Et en même temps, vérifiez ce que donne cet alert après les getElementById et avant les .style.display:
Code:

1 2 alert(fields + "/" + fieldsbis);
20/10/2009, 12h05
E.Bzz

Citation:

Envoyé par vermine

Et en même temps, vérifiez ce que donne cet alert après les getElementById

Heu ... intérêt ?

On sait qu'ils existent, et faire des alert() d'objets ... :?

A+
20/10/2009, 12h07
vermine

Si ils ne renvoient pas [object] tous les deux, c'est qu'on regarde au mauvais endroit et que forcément les .style.display ne fonctionneront pas.
20/10/2009, 12h11
E.Bzz

@Darkroro:

Citation:

Envoyé par E.Bzz

On peut voir (tout) le nouveau code ?
20/10/2009, 12h18
Darkroro

Comme je l'ai dit précédemment, selon la manière dont j'écris la fonction j'obtiens pas la même erreur...

J'ai viré tout le code qui pose soucis dans mes pages pour test si j'ai d'autres erreurs et rien donc j'ai tout remis.

J'ai renommé mes fields pour qu'ils aient des noms plus cohérents (j'ai pas de doublons)

ma fonction JS... (que j'ai testé de 2 manières précédemment citées)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
function check_test(test) {
	var fields = document.getElementById("fields");
	var fieldsbis = document.getElementById("fieldsbis");
	if(test == '05' || test == '08') {
		fields.style.display = "none";
		fieldsbis.style.display = "table";
	} else {
		fields.style.display = "table";
		fieldsbis.style.display = "none";
	}
}

le code HTML généré à l'endroit où y'a mes tables à switch... (j'ai rajoute là où j'appelle fonction)

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
 
...
<tr>
  <td>
    <select name="test" id="test" onchange="javascript:check_test(this.value);">
      <option value="01">option1</option>
      <option value="02">option2</option>
      <option value="03">option3</option>
      <option value="04">option4</option>
      <option value="05">option5</option>
      <option value="06">option6</option>
      <option value="07">option7</option>
      <option value="08">option8</option>
    </select>
  </td>
</tr>
<tr><td>
  <table id="fields" style="display:table;">
    <tr>
      <td class="texte">champ1:</td><td>&nbsp;</td>
      <td><input type="text" value="" name="champ1" id="champ1" Onclick="document.getElementById('champ1').className='class2';" Onchange="document.getElementById('champ1').className='class3';" Onblur="document.getElementById('champ1').className='class3';" size=20 class="class3"></td>
      <td>&nbsp;&nbsp;</td>
      <td class="texte">champ2:</td>
      <td>&nbsp;</td>
      <td><input type="text" value="" name="champ2" id="champ2" Onclick="document.getElementById('champ2').className='class2';" Onchange="document.getElementById('champ2').className='class3';" Onblur="document.getElementById('champ2').className='class3';" size=20 class="class3"></td>
    </tr>
  </table>
  <table id="fieldsbis" style="display:none;">
    <tr>
      <td><select class="deroulant" name="select1" id="select1">option</select></td><td>&nbsp;</td>
      <td class="texte">champ3:</td>
      <td><input type="text" value="" name="champ3" id="champ3" Onclick="document.getElementById('champ3').className='class2';" Onchange="document.getElementById('champ3').className='class3';" Onblur="document.getElementById('champ3').className='class3';" size=20 class="class3"></td>
      <td>&nbsp;</td>
      <td class="texte">champ4:</td>
      <td><input type="text" value="" name="champ4" id="champ4" Onclick="document.getElementById('champ4').className='class2';" Onchange="document.getElementById('champ4').className='class3';" Onblur="document.getElementById('champ4').className='class3';" size=20 class="class3"></td>
    </tr>
    <tr>
      <td><select class="deroulant" name="select2" id="select2">option</select></td>
      <td>&nbsp;</td>
      <td class="texte">champ5:</td>
      <td><input type="text" value="" name="champ5" id="champ5" Onclick="document.getElementById('champ5').className='class2';" Onchange="document.getElementById('champ5').className='class3';" Onblur="document.getElementById('champ5').className='class3';" size=20 class="class3"></td>
      <td>&nbsp;</td>
      <td class="texte">champ6:</td>
      <td><input type="text" value="" name="champ6" id="champ6" Onclick="document.getElementById('champ6').className='class2';" Onchange="document.getElementById('champ6').className=\'class3';" Onblur="document.getElementById('champ6').className='class3';" size=20 class="class3"></td>
    </tr>
  </table>
</td></tr>
...

20/10/2009, 12h25
kernelfailure

Et ta fonction check_test est appelée où et quand ?
20/10/2009, 12h27
E.Bzz

Un truc qui me chagrine c'est tes valeurs de display.
C'est plutôt prévu pour le XML on dirait ...

Ça donne quoi en utilisant que none/block/inline ?

A+
20/10/2009, 12h46
Darkroro

Ok ça a l'air d'être bon... en tout cas le switch marche...
J'ai remplacé toutes mes propriétés display en "" au lieu de "table"

pfff...
20/10/2009, 13h25
vermine

Citation:

Envoyé par Darkroro

EDIT : je viens de test l'astuce de vermine, ça passe pas

Ca ne marche pas, puis ça marche. :cfou:

:wink:

Mais mieux vaut utiliser "inline" ou "block" (voire les deux) que le vide, comme l'a précisé E.Bzz.
20/10/2009, 13h46
E.Bzz

Citation:

Envoyé par vermine

Mais mieux vaut utiliser "inline" ou "block"

+1
"block" au lieu de "" en l'occurrence

A+
20/10/2009, 14h08
Darkroro

@Vermine : j'avais dû test avec un erreur dans mon code :?

Je vais testé "block" voir si ça brise pas mes callages...

En tout cas merci pour tout !

PS : j'ai une nouvelle erreur sous IE maintenant genre à la ligne 2230 et des banane... mais j'ai pas plus de 800 lignes dans mon code et dans le source généré... bizarre non ?
20/10/2009, 14h13
E.Bzz

Citation:

Envoyé par Darkroro

PS : j'ai une nouvelle erreur sous IE maintenant genre à la ligne 2230 et des banane... mais j'ai pas plus de 800 lignes dans mon code et dans le source généré... bizarre non ?

Ça serait pas dans un .js en include ?

A+

Voir 40 message(s) de cette discussion en une page