Discussion :

[nandofive]

Peut-on faire un select qui prendrait la class de l'option choisie par l'utilisateur ?

Exemple :

Code :

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

1
2
3
4
5
6
7
8
<select  class="Fonction qui appellerait la classe de l'option" name="category">
                       <option selected="selected" value="0">-- Faites votre choix --</option>
                       <option value="1" class="AAAAA">choix 1</option>
                       <option value="2" class="BBBBB>choix 2</option>
                       <option value="3" class="CCCCC>choix 3</option>
                       <option value="4" class="DDDDD>choix 4</option>
                       <option value="-1" class="EEEEE>autre choix >></option>
               </select>

[Bisûnûrs]

Un truc dans le style :

Code html :

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

<select onchange="this.className = this.options[this.selectedIndex].className" ...>

[nandofive]

En fait je me suis mal exprimé désolé.

Jai une page avec 24 selects dans un form. L'utilisateur de la page doit en sélectionner 11 sur les 24. Je souhaiterai que les 11 selects aient un fond jaune lorsqu'il sont sélectionnes, mais j'aurai aimé que le fond reste jaune sur ces select si après un submit l'utilisateur revient en arrière avec la fonction précédent de son navigateur.

1/- Est-ce possible ?

Pour plus de compréhension :

http://www.eloquor.fr/script.php

Si vous faites précédent dans votre navigateur le select retient bien le choix mais ne retient pas la class.

J'aurai aimé que le fond reste jaune après le retour en arrière pour des raison de lisibilité.

Encore merci de votre aide.

[Bisûnûrs]

Je viens de tester ta page avec Firefox2 et IE6 et je n'ai pas eu de problème, le select est resté jaune après un retour arrière.

[nandofive]

Effectivement le select reste jaune sur IE 7 mais pas sur firefox 2.0.0.9 chez moi. Sûrement un problème lié au navigateur.
Je vais voir si je trouve la solution car la réinstallation de firefox n'a rien fait.

Merci ++

[Bisûnûrs]

Pourtant j'ai bien Firefox 2.0.0.9 aussi et je n'ai pas de soucis.

[nandofive]

La fonction Autre choix fonctionne sur IE chez toi car elle ne fonctionne que sur firefox chez moi ?

[Bisûnûrs]

Non, ça ne fonctionne pas sur IE.

Mais tu as pas mal d'erreur de syntaxe, notamment le fait que tu sépares les instructions par des virgules dans le onchange alors qu'il faudrait mettre des points-virgules.

Tu devrais de plus déclarer ta variable $name avant tes fonctions et l'affecter non pas dans le onchang mais dans la fonction clicListe().

[nandofive]

Non, ça ne fonctionne pas sur IE.

Mais tu as pas mal d'erreur de syntaxe, notamment le fait que tu sépares les instructions par des virgules dans le onchange alors qu'il faudrait mettre des points-virgules.

Tu devrais de plus déclarer ta variable $name avant tes fonctions et l'affecter non pas dans le onchang mais dans la fonction clicListe().

Pour les virgules ok

Comment attribuer la variable $name dans la fonction clicListe()

J'ai tenté un :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
function clicListe(obj)
{
var  $name = this.id;
var choix = parseInt(obj.options[obj.selectedIndex].value)
 if (choix==-1)
 {
    document.getElementById('inputChoix').style.display = "block";
 }
 else
 {
    document.getElementById('inputChoix').style.display = "none";
 }

cela ne fonctionne ni sur IE ni sur Firefox.

A défaut d'attribuer ma nouvelle option à un select précis peut-on l'attribuer au deux select ?

[Bisûnûrs]

Là tu déclares la variable $name localement. Il faudrait en faire une variable globale. De plus, tu lui affectes this.id, mais this ne correspond plus au select.

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<script type="text/javascript">
/* Déclaration de la variable globale */
var $name;
 
 
function add() 
{
 var objListe = document.getElementById($name);
 var valTxt = document.getElementById('newcat').value;
 var opt = objListe.options[objListe.options.length-1];
 
 objListe.options[objListe.options.length-1] = new Option(valTxt,valTxt, false, false);
 objListe.options[objListe.options.length] = opt;
 document.getElementById('newcat').value = "";
}
 
function clicListe(obj)
{
 
 /* Affectation de la variable globale */
 $name = obj.id
 
 
 var choix = parseInt(obj.options[obj.selectedIndex].value)
 if (choix==-1)
 {
    document.getElementById('inputChoix').style.display = "block";
 }
 else
 {
    document.getElementById('inputChoix').style.display = "none";
 }
 
}
</script>

[nandofive]

Un grand merci à Bisûnûrs pour son aide. Le script fonctionne de façon impeccable
dans Firefox 2.0.0.9, Internet explorer 7.0.5730.11 et Netscape 7.1.

PS : Chez moi seul le problème du background des selects persiste dans firefox et Netscape mais cela doit être du à un paramétrage bidon dans mon pc. Si quelqu'un connaît le paramétrage qui peut régler mon problème je suis preneur.