Couleurs des éléments SELECT après submit

**zorbo** · 26/09/2010, 10h37

Bonjour,

J'ai une petite question qui me cause perplexité:

J'ai une page de recherche avancée depuis laquelle l'on peut lancer une requête d'après critères multiples (10 menus à select simple ) sur une base d'articles en choisissant un ou plusieurs critères.
J'ai, grâce à une fonction php, fixé les termes de la recherche en laissant sélectionnés les critères choisis APRÈS soumission du formulaire (echo selected).
La stratégie est plutôt bonne car on sait donc que la liste d'articles proposés en dessous correspond aux critères sélectionnés au dessus, cela permet d'affiner son choix encore un peu plus précisément.
Mais je voudrais aller encore un peu plus loin en COLORANT les éléments sélectionnés dans les menus et seulement ceux-là, afin de mieux les repérer visuellement.

Je me suis creusé la tête, pas assez sans doute, pour adapter une fonction JS avec des CSS mais dés soumission du formulaire, les attributs de classe disparaissent.
Y-a-t-il une solution avec le couple JS + CSS ?

**SpaceFrog** · 26/09/2010, 10h47

php css suffit ...

css

Code :

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

1
2
3
<style type='text/css'>
.selected {background-color:red;}
</style>

construction des options avec php

Code :

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

echo '<option value="'.$value.'" '.(($value==$_POST['sel'])?'class="selected" ':'').'>aa</option>';

**zorbo** · 26/09/2010, 11h53

Merci de votre réponse,

J'ai cependant un petit souci de positionnement de cette balise class.
Voici comment je procède:

Les menus déroulants (une dizaine) se présentent ainsi:

Code :

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

1
2
3
4
5
6
7
 
<select name="port" id="select"CLASS="champe" onChange="this.form.submit()">
                      <option value="%"<?php echo choixParDefaut7('%'); ?>>Indiff&eacute;rent</option>
                      <option value="Droit"<?php echo choixParDefaut7('Droit'); ?>>Droit</option>
                      <option value="Touffu et retombant"<?php echo choixParDefaut7('Touffu et retombant'); ?>>Touffu et retombant</option>
                      <option value="Dense"<?php echo choixParDefaut7('Dense'); ?>>Dense</option>
                    </select>

Afin de garder la selection après submit, j'ai adapté le code suivant:

Code :

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

1
2
3
4
5
6
7
8
9
 
<?php
function choixParDefaut7($port) // début fonction port
{ $par_defaut7 = ''; 
    if (isset($_POST['port'])) 
   {if ($_POST['port'] == $port)         {
   $par_defaut7='selected="selected"';  }    }
return $par_defaut7; }
?>

Je ne sais donc pas ou placer cette classe.

**SpaceFrog** · 26/09/2010, 12h05

mon code est pourtant explicite ... le class est dans l'option

en gros le code généré donne

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<style type='text/css'>
.selected {background-color:red;}
</style>
</head>
 
<body>
<select>
 <option>aa</option>
 <option >aa</option>
 <option class="selected" >aa</option>
 <option >aa</option>
 <option>aa</option>
 <option >aa</option>
</select>

il faudrait par la même occasion attribuer un selected sur l'option selectionnée

**zorbo** · 26/09/2010, 13h02

Oui, en effet, le menu se déroule coloré mais cette option de couleur disparait aussitôt après submit.

**SpaceFrog** · 26/09/2010, 13h14

oui

normal ...
d'ou la nécessité d'attribuer le class en php coté serveur comme montré dans le code précédent en testant l'egalité entre le value de l'option et la valeur postée ...

Couleurs des éléments SELECT après submit

JavaScript

Vue hybride

Discussions similaires

Partager

Partager