Vous serez confronter très souvent a la création de formulaire. Une fois que l'utilisateur a rentrer tout les champs il vous faudra vérifier l'intégriter des données, les champs d'email ainsi que les champs texte, il faut bien vérifier que chaque champs a été bien rentrer par les utilisateurs, voici une fonction JavaScript vous permettant de vérifier les champs :
function verifyChamp(form, champ, mail)
{
if (mail == false)
{
if (trim(document.forms[form].elements[champ].value) == "")
{
document.forms[form].elements[champ].className = 'wrong_element';
return false;
}
else
{
document.forms[form].elements[champ].className = 'right_element';
}
}
else
{
if (trim(document.forms[form].elements[champ].value) == "")
{
document.forms[form].elements[champ].className = 'wrong_element';
form = false;
}
else
{
if(!validation_mail(document.forms[form].elements[champ].value))
{
document.forms[form].elements[champ].className = 'wrong_element';
form = false;
}
else
{
document.forms[form].elements[champ].className = 'right_element';
}
}
}
}
Il vous suffira ensuite d'ajouter un êvenemtn onsubmit à votre formulaire ainsi que deux classes (wrong_element et rigt_element) à votre fichier CSS. Dans l'êvement il vous faudra créer une fonction comme ceci :
function verif_feedback()
{
form = true;
form = verifyChamp("feedback","email", true);
form = verifyChamp("feedback","texte", false);
return form;
}
<form onsubmit="return verif_feedback()" name="feedback">
<label>Email : </label><input type="text" name="email"> <br />
<label>Texte : </label><input type="text" name="texte"> <br />
<input type="submit" name="Envoyer !">
</form>
Et pour le CSS voici un petit exemple :
.wrong_element
{
border: solid 1px #c24949;
background-color: #ffbcbc;
}
.right_element
{
border: solid 1px #49c24f;
background-color: #bcffbf;
}
Et voila votre champ deviendra rouge si il n'est pas correct et vert si il est correct.