boucle getElementById disabled

Version imprimable

Bonjour,

J'ai un code qui marche sous IE9 mais pas sous Firefox 11.0 ni Chrome 18.0.
Voici le code :
Code:

1 2 3 4 5 6 7 8 9 // boucle sur $i ... onclick='if (document.getElementById(\"ligne[$i]\").disabled==false document.getElementById(\"ligne[$i]\").disabled=true else window.document.getElementById(\"ligne[$i]\").disabled=false ;'>" ; <p id='ligne[$i]' ...>
Le paragraphe "p" contient du texte et un select.
Sous IE, sur clic le texte et le selec de "p" se "disabled" puis se "enable".
Sous FirexFox et Chrome ça ne marche pas.

Une idée ???

c'est quoi ce onclick avec du texte et des ' et \"
je ne comprends rien

j'imagine que ce que tu veux faire c'est ajouter un lien avec un boucle for

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var ElementOuPlacerLesLiens = document.getElementById('IdDeLElementOuPlacerLesLiens');
 
for (var i=0; i<max; i++) {
  var lien = document.createElement('A');
  lien.setAttribute('href', '#');
  lien.onclick = function() {
    if(document.getElementById('ligne[' + $i + ']').disabled==false) {
      document.getElementById('ligne[' + $i + ']').disabled=true;
    } else {
      document.getElementById('ligne[' + $i + ']').disabled=false;
    } 
  }
  ElementOuPlacerLesLiens.appendChild(lien);
}

si ton tag p est généré dans la boucle for c'est encore plus simple

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var ElementOuPlacerLesLiens = document.getElementById('IdDeLElementOuPlacerLesLiens');
var ElementOuPlacerLesParagraphes = document.getElementById('IdDeLElementOuPlacerLesParagraphes');
 
for (var i=0; i<max; i++) {
  var lien = document.createElement('A');
  lien.setAttribute('href', '#');
  lien.para = document.createElement('P');
  //...
 
  lien.onclick = function() {
    if(this.para.disabled==false) {
      this.para.disabled=true;
    } else {
      this.para.disabled=false;
    } 
  }
  ElementOuPlacerLesLiens.appendChild(lien);
  ElementOuPlacerLesParagraphes.appendChild(lien.para);
}

enfin si IE9 accepte ton code, je crois que M$ n'a pas fait beaucoup de progrès car il n'est absolument pas conforme à la norme et plein d'erreur de syntaxe.

A+JYT

22/04/2012, 17h17
jpguiche

ok

Thanks a lot sekaijin,... mais en te lisant je m'aperçois que je n'ai pas posté ma question au bon endroit... En effet, je débute en JS et en fait ce petit bout de code JS est dans du PHP : à l'intérieur d'un TAG j'ai le onscript='...' donc c'est plutôt dans le forum PHP que je vais le poster.

JP

je te déconseille de généré le js en php
mieux vaut un fichier switch.js

Code:

1
2
3
4
5
6
7
8
9
function switch(paraId) {
  var para = document.getElementById(paraId);
  if(para.disabled==false) {
    para.disabled=true;
  } else {
    para.disabled=false;
  }
  return false; 
}

et dans le php

Code:

1
2
 
?><a onclick="return swtich('<?php echo ligne[$i]; ?>')">click</a><?php ;

A+JYT

22/04/2012, 17h43
Eric2a

Salut,

Il manquait la parenthèse fermante dans la condition JS.

Code:

echo "<input type='checkbox' onclick='if(document.getElementById(\"ligne[$i]\").disabled==false)document.getElementById(\"ligne[$i]\").disabled=true;else document.getElementById(\"ligne[$i]\").disabled=false;'>";

On aurait pu simplifier...

Code:

echo '<input type="checkbox" onclick="document.getElementById(ligne[$i]).disabled=!document.getElementById(ligne[$i]).disabled;">';

Mais si tu débutes en JS, le mieux est de commençer à suivre les bonnes pratiques comme celles recommandées par sekaijin.
23/04/2012, 10h58
sekaijin

je te conseille tout de même de mettre ton javasript dans un fichier js ton php sera plus propre et lisible
mais surtout tu bénéficira de l'efficacité du navigateur

j'ai donné une explication ici

A+JYT
23/04/2012, 14h31
jpguiche

le pb me semble ailleurs

Merci de vos réponses. Mais outre le fait que c'est effectivement plutôt mal écrit, le pb de fond me semble être le suivant :

Dans le code JS, je mets l'attribut "disabled" à true / false sur un élément paragraphe qui contient du texte + un select. Je fais ça pour factoriser le "disabled" de sorte que le texte + le select deviennent grisés / dégrisés lorsque l'on déclenche le onclick.

En fait je n'arrive pas à trouver la référence complète du JS et je ne suis pas sûr que l'attribut "disabled" existe pour un élément "<p>". Il se trouve qu'avec IE ça marche donc il doit faire hériter les éléments inclus dans "<p>" de l'attribut, ce qui donne du grisé pour du texte et pour du select. Par contre sur Firefox et Chrome ça ne marche pas.
23/04/2012, 14h58
sekaijin

normal il ne s'agit pas de javascript mais de HTML

les capacités des tag HTML sont décrites dans les normes DOM HTML
http://www.w3.org/TR/DOM-Level-2-HTML/
http://www.w3.org/TR/DOM-Level-3-Core/

javascript ne permet que d'accéder à ces capacité mais ne définit aucunement quelques sont les attributs du DOM.

javascript définit le langage.
http://www.ecma-international.org/pu...T/Ecma-262.pdf

Le DOM définit les objet d'une page HTML

les normes W3C donne la façon don javascript inter agit avec le DOM
http://www.w3.org/TR/DOM-Level-2-Cor...t-binding.html
http://www.w3.org/TR/DOM-Level-3-Cor...t-binding.html

A+JYT
23/04/2012, 15h25
jpguiche

effectivement en regardant le std

Effectivement, je suis allé voir la ref que tu donnes et il est marqué :
"The following elements support the disabled attribute: BUTTON, INPUT, OPTGROUP, OPTION, SELECT, and TEXTAREA." Et donc le paragraphe ne supporte pas l'attribut disabled en standard. Par conséquent ça marche sous IE... parce que IE ne respecte pas le standard !! dommage ça me simplifiait la vie...