Discussion :

[Zwiter]

Bonjour,
Je developpe une application web, et j'ai des champs dynamiques editables via javascript en nombre important.

je cherche s'il existe un moyen autre que les class (getElementByClass) pour selectionner toutes les balises (div) ayant la commande onclick declenchant l'edition du contenu.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div id="user" onclick="div2form(this)">Zwiter<div>

Par avance, merci de votre aide.

Zwiter

[4R416N33]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script type="text/javascript">
liste = new Array();
 
function ajout(id) {
for(i=0; i<liste.length; i++) {
   if(liste[i] == id) {
      return 0;
   }
}
liste[liste.length] = id;
}
 
function traitement() {
for(i=0; i<liste.length; i++) {
   tempDiv = document.getElementById(liste[i]);
 
   // Suit tes traitements sur tempDiv
 
}
}
</script>

et pour tes div avec onClick

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<div id="monId" onMouseOver="ajout('monId')" onMouseOut="ajout('monId')">
...
</div>

J'ai pas pris le temps de tester le code, mais dans l'idée, c'est ça...

[Zwiter]

Merci 4R416N33 (vive le copier coller, on a pas idée d'avoir un nom pareil)
ceci serait effectivement une solution, si je n'utilisait pas mes id pour etiqueter le contenu de mes balises div, et ainsi mettre a jour une base de donnees et/ou une variable de session identifiées par cet id.

la solution que j'ai pour l'instant et que je suis en train d'implementer est d'utiliser un nom de class pour pouvoir toute les selectionner a la fois. prototype.js le fait tres bien.

Toutefois, si vous avez une solution en javascript, meme si elle est moins elegante, ecrivez la. je voudrais savoir si c'est possible ou non.

Zwiter

[SpaceFrog]

première remarque getElementByClass n'existe pas en javascript ...
peut être implémenté comme prototype dans prototype.js

seconde reflexion... les id sont uniques ?
un id devant être unique sur la page ...
cette methode :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
function ajout(id) {
for(i=0; i<liste.length; i++) {
   if(liste[i] == id) {
      return 0;
   }

me semble plus que douteuse ..

tu devras soit:

• boucler sur les getElementsByTagName('div') et tester l'id si tu as un nommage rationnel des id (monid_1, monid_2 ...)
• boucler sur getElementsByTagName('div') et tester la class si c'est un dénominatuer commun
• boucler sur getElementsByTagName('div') et tester un attribut personnel

[Zwiter]

SpaceFrog, j'avais interprete la solution de 4R416N33 tel que tu le dis. Toutefois, je ne peux/veux pas toucher aux id.

Effectivement, getElementByClassname n'existe pas dans javascript de base, et est implemente via un prototype dans prototype.js.

Ma question est devenue :
peut-on selectionner un element dans une page grace a un autre element grace a autre chose ?

Je m'auto reponds car je viens de penser a un debut de solution.
Ca serait de parcourir les elements de la page a la recherche de l'attribut 'onclick' en verifiant si il est defini.
Qu'en pensez vous?

Mais je vais garder la solution de la class factice, qui me semble la plus elegante.

Zwiter

[SpaceFrog]

Comme précisé précédemment si tu peux rajouter un attribut personnel dans la balise div ...

Maintenant si il n'y a que les divs de ce type qui on un onclick, tu peux essayer de voir dans la boucle si

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

obj.onclick instanceOf Function

[Zwiter]

Je ne connaissais pas instanceOf.
merci SpaceFrog et 4R416N33 pour votre aide.

Zwiter

[SpaceFrog]

Ben on dirait bein en effet que ça marche

a condition, d'utiliser la bonne syntaxe sans O majuscule ... :red:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script type='text/javascript'>
function bar(){
TabDivs=document.getElementsByTagName('div')
for(i=0;TabDivs[i];i++){
 alert(TabDivs[i].onclick instanceof Function)
 
 }
 }
 
</script>
</head>
 
<body onload="bar()">
<div id='foo' onclick="alert('coucou')">khkjh</div>
<div id='foo' >khkjh</div>
 
</body>