Page 1 sur 1

class sur input (formulaire)

Posté : 25 mai 2010, 12:55
par bunk
Bonjour,

J'ai un div qui se nomme "form" dans lequel j'ai un formulaire.
Dans ma feuille de style j'applique une petite personnalisation pour (tous) les champs input, comme ceci :

Code : Tout sélectionner

div#form input{ border: 1px double #788894; border-style:solid; background-color: #FFFFFF; margin-bottom: 5px; } div#form input:hover{ background-color: #bfaf99; color: #FFFFFF; } div#form input:focus{ border: 1px double #305E81; }
Lors de la validation de mon formulaire je voudrais changer la couleur de bordure des champs input en appliquant une class comme ceci :

Code : Tout sélectionner

.input-erreur { border-color: red; }
Malheureusement cela ne fonctionne pas. A quel niveau dois-je appliquer cette modification ?

D'avance merci.

Re: class sur input (formulaire)

Posté : 25 mai 2010, 13:12
par Lupuz
il faut que tu appliques le nouveau style avec une fonction javascript lors de la validation.

Re: class sur input (formulaire)

Posté : 25 mai 2010, 13:14
par bunk
j'aurais préféré ne pas utiliser le JavaScript, c'est obligatoire ?

Re: class sur input (formulaire)

Posté : 25 mai 2010, 13:17
par Lupuz
Oui,
le CSS ne permet pas de gestion d'évènement de ce type.

Re: class sur input (formulaire)

Posté : 25 mai 2010, 13:26
par macgawel
Bonjour,

J'ai un div qui se nomme "form" dans lequel j'ai un formulaire.
Ca commence mal :
Soit tu utilises la balise form et tu n'as pas besoin de ton div, soit tu l'as oubliée et ce n'est plus un formulaire.
Lors de la validation de mon formulaire je voudrais changer la couleur de bordure des champs input en appliquant une class comme ceci :

Code : Tout sélectionner

.input-erreur { border-color: red; }
Malheureusement cela ne fonctionne pas. A quel niveau dois-je appliquer cette modification ?
C'est un peu court...
Qu'est-ce qui ne "fonctionne pas" ?
Comment appliques-tu la classe ?

Vu que tu dis ne pas vouloir faire de JS, et qu'on est sur un forum PHP, je vais supposer que tu fais ta validation en PHP.
Du coup :
echo "<input id='nom'";
if ($erreur_sur_le_nom === true) {
   echo " class='input-erreur'";
}
echo " />";

Re: class sur input (formulaire)

Posté : 25 mai 2010, 16:07
par Nours312
as tu testé :

Code : Tout sélectionner

div#form input.input-erreur { border-color: red; }
il est possible que ce soit juste une question de priorité ^^

Re: class sur input (formulaire)

Posté : 25 mai 2010, 16:19
par bunk
merci pour vos réponses qui m'ont mis sur la bonne piste. J'avais une faute de frappe dans mon fichier css.

Merci.