Bonjour,

J'ai un tableau existant contenant le nom prénom et l'activité d'une personne.
L'activité d'une personne se sélectionne via un select. donc sur l'action onchange du select j'ai donc décidé d'ajouter des colonnes ou pas selon la valeur du select

function ChampsSDM(valeur)
{
if (valeur=="SDM"){
document.getElementById("SDM").style.display = 'block';
}
else{
document.getElementById("SDM").style.display = 'none';
}
}

<table border="1">
<tr>
 <td>Nom</td>
 <td>Prénom</td>
 <td>Activité</td>
 <td id="SDM" style="display:none;">Champs caché 1</td>
 <td id="SDM" style="display:none;">Champs caché 2</td>
</tr>
<tr>
 <td>dupond</td>
 <td>jean</td>
 <td>
 <select name="activite" onchange="ChangeSDM(this.value);">
 <option value="ABC">ABC</option>
 <option value="SDM">SDM</option>
 <option value="123">123</option>
 </select>
 </td>
 <td id="SDM" style="display:none;">Valeur caché 1</td>
 <td id="SDM" style="display:none;">Valeur caché 2</td>
</tr>

Je suis bien conscient que ça ne fonctionne avec qu'un seul id (le premier), j'ai essayer avec les class, sauf que sa ne fonctionne pas sous IE.
Comment faire pour ajouter une colonne à mon tableau ssi la value du select = SDM??

function gebcn(class) {
  if(document.getElementsByClassName) {
   return document.getElementsByClassName(class);
  }
 else {
    var all = document.getElementsByTagName('*'),    res = [];
    for(var i=0,l=all.length;i<l;i++) {
      if(all[i].className == class) {
        res.push(all[i]);
      }
    }
    return res;
  }
}

Petite astuce qui fonctionne pour IE avec les classes
+
Birdy

ça ne fonctionne toujours pas pour IE ainsi:

function className(class) {
  if(document.getElementsByClassName) {
   return document.getElementsByClassName(class);
  }
 else {
    var all = document.getElementsByTagName('*'),    res = [];
    for(var i=0,l=all.length;i<l;i++) {
      if(all[i].className == class) {
        res.push(all[i]);
      }
    }
    return res;
  }
}


function ChampsSDM(valeur)
{
var classNamed = className("SDM");
for(var i in classNamed)
{
if (valeur=="SDM"){
classNamed[i].style.display = 'block';
}
else{
classNamed[i].style.display = 'none';
}
}
}

Et l'affichage est bizarre (les td ne sont pas cote à cote mais l'un au dessus de l'autre...)

<td id="SDM" style="display:none;">Champs caché 1</td>
 <td id="SDM"

Tu mets plusieurs éléments HTML avec le même id ... totalement interdit !

dans mon nouveau code j'ai remplacer id par class
je sais bien que c'est pas possible

Remontre ton code actuel stp

Le javascript

function className(class) {
  if(document.getElementsByClassName) {
   return document.getElementsByClassName(class);
  }
 else {
    var all = document.getElementsByTagName('*'),    res = [];
    for(var i=0,l=all.length;i<l;i++) {
      if(all[i].className == class) {
        res.push(all[i]);
      }
    }
    return res;
  }
}


function ChampsSDM(valeur)
{
var classNamed = className("SDM");
for(var i in classNamed)
{
if (valeur=="SDM"){
classNamed[i].style.display = 'block';
}
else{
classNamed[i].style.display = 'none';
}
}
}

et l'HTML:

<table border="1">
<tr>
 <td>Nom</td>
 <td>Prénom</td>
 <td>Activité</td>
 <td class="SDM" style="display:none;">Champs caché 1</td>
 <td class="SDM" style="display:none;">Champs caché 2</td>
</tr>
<tr>
 <td>dupond</td>
 <td>jean</td>
 <td>
 <select name="activite" onchange="ChampsSDM(this.value);">
 <option value="ABC">ABC</option>
 <option value="SDM">SDM</option>
 <option value="123">123</option>
 </select>
 </td>
 <td class="SDM" style="display:none;">Valeur caché 1</td>
 <td class="SDM" style="display:none;">Valeur caché 2</td>
</tr>

PS: j'ai trouver pour le problème d'affichage, au lieu de mettre display = 'block', j'ai mis, display = 'table-cell' (car c'est des td)

Sinon me manque toujours le problème de compatibilité avec IE

ça ne marche pas sur IE avec la fonction que je t'ai mis plus haut (et que tu utilises là ) ?
ou plutôt, quel est le problème sur IE ?
test avec des alert()

Eh bien il ne rentre jamais dans le else de ta fonction... j'ai mis alert("FF"); après le if
et alert("IE"); après le else et j'ai bien FF mais jamais IE

tu as bien mis le alert avant le return ?

J'ai trouvé! tu passe class en paramètre de la fonction or class est un mot réservé j'ai donc mis classe et la le alert fonctionne...mais ça ne fonctionne toujours pas...
quand je fais alert(all[i]); il m'affiche [object]
mais quand je fais alert(res[i]); après res.push(all[i]); il m'affiche undefined
Ya un problème au niveau du tableau mais quoi...

alert (res[0]) affiche object ?

oui

PS: La boucle for(i in ClassNamed) s'arrete a 0 au lieu l'aller à 3 c'est normal?

en fait, res est un tableau qui contient tous les elements qui ont la classe donnée en paramètre.
Donc la fonction marche

sa fonctionne le problème vient de table-cell non reconnu sous IE j'ai donc fait une condition pour que sa s'affiche correctement en fonction du navigateur merci pour ton aide

Pense à mettre le sujet en résolu