Discussion :

[Jsh]

Bonjour,

Afin de changer la flèche d'un dropdownlist, je masque celle du select d'origine et fait passer devant une autre image en CSS.
Pour régler des problème de tailles variables, je mets tout ça dans un tableau.

J'aimerais lorsque je clique sur mon image que le select se déploie mais que nenni !

J'ai testé le OnClick, cela marche, mais je pense que l'ouverture du select n'est pas (uniquement ou n'est pas tout court) sur le click du select.

Voici le code :

Code html :

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
<table>
            <tr>
                <td>
                    <div class="selectparent">
                    <select class="select2">
                        <option value="1">Ligne de test 1</option>
                        <option value="2">Ligne de test 2</option>
                        <option value="3">Ligne de test 3</option>
                    </select>
                    </div>
                </td>
                <td>
                    <div class="fleche" onclick="document.getElementById('totocheck').click();" ></div>
                </td>
            </tr>
        </table>

Quelqu'un aurait une idée pour me mettre sur la bonne voie ?

Merci.

[SylvainPV]

Bonjour,

Quitte à styliser la boîte de sélection, tu pourrais la remplacer complètement par un nouveau plug-in. Car selon le système/navigateur, les select box n'ont pas la même taille ou la même couleur, ce qui rend compliqué le fait de styliser qu'une partie.

J'utilise cette librairie personnellement : http://harvesthq.github.io/chosen/

[Bovino]

Ta méthode est particulièrement moche... Mais tu peux utiliser une balise <label> (avec l'attribut for correctement renseigné) à la place de la balise <div>.

Sinon, tu peux regarder du côté de Donner du style aux listes déroulantes.

[Jsh]

Oui merci pour les liens et les composants. J'ai déjà testé tout ça. Avec un texte qui passe par dessus la flèche.

Ma DropdownList fait du databind, y'a du .Net derrière tout ça. donc je cherche une solution JavaScript pas CSS.

[SylvainPV]

Ma DropdownList fait du databind, y'a du .Net derrière tout ça. donc je cherche une solution JavaScript pas CSS.

En quoi le data-binding empêche d'utiliser CSS ? C'est justement l'inverse, il faut veiller à ne pas faire n'importe quoi en JS si le contenu est généré côté serveur