[Planning]Colorer toutes les occurrences d'un nom, en JS
Bonjour,
J'ai un tableau généré dynamiquement en PHP qui représente le planning du mois en cours.
Afin de faciliter la lisibilité, on m'a demandé de créer un petit input text où lorsque l'on rentre le nom d'une personne, toutes les occurrences présentes dans le tableau prennent une couleur particulière.
Pour le moment, toutes les cellules de mon tableau ont une classe prédéfinie : Class = couleur_normale. Lorsque l'on rentre le nom d'une personne, la class devient class= couleur_select.
Voici mon code :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| function colorer(){
var nom = document.getElementById('nom').value;
var tab = document.getElementsByClassName('couleur_normale');
for (i in tab)
{
if (tab[i].innerHTML == nom)
{
tab[i].className = "couleur_select";
}
else
{
tab[i].className = "couleur_normale";
}
}
} |
La fonction getElementsByClassName est implémentée plus bas et marche sans problème.
Mon soucis : lorsque je clique une première fois sur mon bouton "colorer", tous les noms se colorent parfaitement bien. Et si je rentre le nom d'un nouveau médecin, il se colore à son tour, mais l'ancien reste aussi coloré (et avec firebug je constate que toutes les occurrences de l'autre médecin restent avec la classe "couleur_select".
J'ai coloré en rouge la partie du code qui ne fonctionne pas. Quelqu'un pourrait m'expliquer pourquoi ? Ca devrait sauter aux yeux mais j'vois pas :cry:
