fonction pour un arrière plan de liste déroulante [Résolu]

[lou87]

Bonsoir,

J'ai récemment créé (avec de l'aide) une fonction en javascript qui devrait permettre de garder la couleur d'arrière plan d'une liste déroulante lorsqu'on sélectionne un élément.

Par exemple je sélectionne "Problème" ayant pour arrière plan la couleur orange, dans ma liste déroulante, et quand ce dernier est sélectionné il faut qu'il garde la couleur d'arrière plan, autrement dit orange..... (cela sous firefox car sous IE ça fonctionne).

Mais là j'avance....... maintenant à pas de fourmi, et j'aimerais un petit coup de pouce.

Voici la fonction en javascript :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function test (val) 
{
/**nameListe = document.Form.listeStatut.name;
alert (nameListe);**/
 
    if (val == "OK")
    {
    document.Form.getElementsByTagName("listeStatut")[0].selected = true;
    document.Form.getElementsByTagName("listeStatut")[0].style.backgroundColor = "#090";
    }
 
    else if(val == "PB")
    {
    document.Form.couleurQ.options[1].selected = true;
    document.Form.couleurQ.options[1].style.backgroundColor = "#F60";
    }
 
    else if(val == "NONOK")
    {
    document.Form.couleurQ.options[2].selected = true;
    document.Form.couleurQ.options[2].style.backgroundColor = "#C00";
    }
}

Et j'aimerais pouvoir utiliser cette fonction sur plusieurs listes déroulantes.

J'avais commencé d'où la première partie différente des autres.

En vous remerciant.

Bonne soirée.

[andry.aime]

Bonsoir,

ça existe une balise "listeStatut" qui a un attribut selected

A+.

[vermine]

Bonjour,

Dans la première partie, c'était sûrement getElementsByName. Bien vu Andry. Dans ce cas-là, vous cherchez les éléments qui ont le nom "listeStatut" et vous agissez sur le premier élément trouvé.

Vous agissez sur une liste.


Dans la seconde partie, vous allez directement sur la liste "couleurQ" et vous prenez sa seconde option (indice 1) ou sa troisième option (indice 2).

Vous agissez sur une option de la liste.

[SpaceFrog]

autant laisser tomber la balise select et prendre quelque chose de plus paramétrable du style plugin jquery voire ui

[NoSmoking]

tout ça me parle, un post un peu équivalent Mettre une option en gras

[lou87]

Bonjour,

Je vous remercie pour vos réponses.

Cependant ma fonction à l'origine ressemblait à ça :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function test (val) 
{
    if (val == "OK")
    {
    document.FormEtude.couleurQ.options[0].selected = true;
    document.FormEtude.couleurQ.options[0].style.backgroundColor = "#090";
    }
 
    else if(val == "PB")
    {
    document.FormEtude.couleurQ.options[1].selected = true;
    document.FormEtude.couleurQ.options[1].style.backgroundColor = "#F60";
    }
 
    else if(val == "NONOK")
    {
    document.FormEtude.couleurQ.options[2].selected = true;
    document.FormEtude.couleurQ.options[2].style.backgroundColor = "#C00";
    }
}

Et mon code HTML à ça :

Code :

1
2
3
4
5
<select size="1" id = "listeStatut" name="couleurQ">
		<option value = "OK" class="o-1" style="background-color:#090;">OK</option>
	        <option value = "PB" class="o0" style="background-color:#F60;">Problème</option>
		<option value = "NONOK" class="o1" style="background-color:#C00;">NON OK</option>
							</select>

Et le but de ma fonction ainsi que de ma liste déroulante est que lorsque l'on sélectionne un élément de la liste déroulante, l'élément garde sa couleur d'arrière plan.

(Ma liste déroulante fonctionne comme je le veux sous IE mais pas sous firefox d'où ma fonction)

Et le début de la fonction que je vous avait montré la dernière fois était pour pouvoir utiliser cette même fonction pour mes trois listes déroulantes.
Je leur ai donné comme identifiant à mes liste déroulantes "listeStatut" donc j'aurais dû mieux utiliser un "getElementsById" au lieu qu'un "getElementsByName", car le nom de mes trois liste déroulantes sont couleurQ, couleurC, couleurD.

En espérant avoir été un peu plus explicite sur ce que j'ai et ce que je voudrais.

En vous remerciant.

P.S : Je n'y connais rien en JQuery....
Les seuls langages utilisés pour ce développement là sont le javascript et le HTML ainsi que l'ASP....

[lou87]

Bonjour,

Finalement un collègue m'a aidé, donc mon problème est résolu.

Merci de m'avoir aidé.

Bonne journée.