Compatibilité sous Firefox
Bonjour à tous,
A mon grand étonnement, j'ai un problème de compatibilité avec Firefox alors que tout fonctionne parfaitement sous IE.
Voilà, j'ai un script qui vérifie les champs entrés par les internautes sur mon formulaire, et lorsqu'il s'agit de champs select, Firefox ne le détecte pas...
Voici mon JS :
<script language="javascript">
// VERIFICATION DES CHAMPS DU FORMULAIRE
// Application d'une couleur aux champs erronés ou vides
function couleur(obj) {
obj.style.backgroundColor = "#FFFFFF";
}
function check() {
var msg = "";
//Vérification du champs civilité
if (document.contact.civilite.value == "") {
msg += "Veuillez indiquer votre civilité.\n";
document.contact.civilite.style.backgroundColor = "#d5dfb6";
}
//Vérification du champs nom
if (document.contact.nom.value == "") {
msg += "Veuillez saisir votre nom.\n";
document.contact.nom.style.backgroundColor = "#d5dfb6";
}
//Vérification du champs client (déjà client > oui ou non)
if (document.contact.client.value == "") {
msg += "Veuillez indiquer si vous êtes déjà client.\n";
document.contact.client.style.backgroundColor = "#d5dfb6";
}
//Vérification : si l'internaute est déjà client et qu'il n'indique pas son numéro client
if (document.contact.client.value == "Oui") {
if (document.contact.numClient.value == "") {
msg += "Vous avez indiqué que vous êtes déjà client. Veuillez saisir votre numéro client.\n";
document.contact.numClient.style.backgroundColor = "#d5dfb6";
}
}
//Vérification : si l'internaute n'est pas client et qu'il n'indique pas ses coordonnées postales
if (document.contact.client.value == "Non") {
if (document.contact.adresse1.value == "") {
msg += "Vous avez indiqué que vous n'êtes pas client. Veuillez saisir votre adresse.\n";
document.contact.adresse1.style.backgroundColor = "#d5dfb6";
}
if (document.contact.codePostal.value == "") {
msg += "Vous avez indiqué que vous n'êtes pas client. Veuillez saisir votre code postal.\n";
document.contact.codePostal.style.backgroundColor = "#d5dfb6";
}
if (document.contact.ville.value == "") {
msg += "Vous avez indiqué que vous n'êtes pas client. Veuillez saisir votre ville de résidence.\n";
document.contact.ville.style.backgroundColor = "#d5dfb6";
}
}
//Vérification du champs message
if (document.contact.message.value == "") {
msg += "Veuillez saisir un message pour que l'on puisse traiter votre demande.\n";
document.contact.message.style.backgroundColor = "#d5dfb6";
}
//Vérification du champs moyenContact (telephone ou email)
if (document.contact.moyenContact.value == "") {
msg += "Par quel moyen souhaitez-vous être recontacté ?\n";
document.contact.moyenContact.style.backgroundColor = "#d5dfb6";
}
//Vérification : si l'internaute préfére être recontacté par téléphone mais qu'il laisse le champs vide
if (document.contact.moyenContact.value == "Téléphone") {
if (document.contact.telephone.value == "") {
msg += "Vous avez indiqué que vous souhaitez être recontacté par téléphone. Veuillez saisir votre numéro de téléphone.\n";
document.contact.telephone.style.backgroundColor = "#d5dfb6";
}
}
//Vérification : si l'internaute préfére être recontacté par email mais qu'il laisse le champs vide
if (document.contact.moyenContact.value == "Email") {
if (document.contact.email.value == "") {
msg += "Vous avez indiqué que vous souhaitez être recontacté par email. Veuillez saisir votre adresse email.\n";
document.contact.email.style.backgroundColor = "#d5dfb6";
}
else if (document.contact.email.value != "") {
indexAroba = document.contact.email.value.indexOf('@');
indexPoint = document.contact.email.value.indexOf('.');
if ((indexAroba < 0) || (indexPoint < 0)) {
document.contact.email.style.backgroundColor = "#d5dfb6";
msg += "L'adresse email indiquée n'est pas correcte.\n";
}
}
}
//Si aucun message d'alerte a été initialisé on retourne TRUE
if (msg == "") return(true);
//Si un message d'alerte a été initialisé on lance l'alerte
else {
alert(msg);
return(false);
}
}
</script>
Et le code de mon formulaire :
<form action="data/envoiEmail/envoiFormContact.php" method="post" enctype="application/x-www-form-urlencoded" name="contact" onSubmit="return check();">
<table width="443" border="0" cellspacing="5" cellpadding="0">
<tr>
<td width="176">Civilité* : </td>
<td width="252">
<select name="civilite" class="FormInput" id="civilite" onKeyUp="javascript:couleur(this);" />
<option>Sélectionnez une valeur</option>
<option value="M.">M.</option>
<option value="Mme">Mme</option>
<option value="Mlle">Mlle</option>
</select></td>
</tr>
<tr>
<td>Nom* : </td>
<td><input name="nom" type="text" class="FormInput" id="nom" size="30" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td>Prénom : </td>
<td><input name="prenom" type="text" class="FormInput" id="prenom" size="30" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td>Êtes-vous client ?*</td>
<td><select name="client" class="FormInput" id="client" onKeyUp="javascript:couleur(this);" />
<option>Sélectionnez une valeur</option>
<option value="Oui">Oui</option>
<option value="Non">Non</option>
</select></td>
</tr>
<tr>
<td colspan="2">Si vous êtes client, veuillez indiquer votre numéro client :</td>
</tr>
<tr>
<td>Numéro client* </td>
<td><input name="numClient" type="text" class="FormInput" id="numClient" size="50" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td colspan="2">Si vous n'êtes pas client, veuillez préciser vos coordonnées complètes : </td>
</tr>
<tr>
<td>Adresse* : </td>
<td><input name="adresse1" type="text" class="FormInput" id="adresse1" size="50" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td> </td>
<td><input name="adresse2" type="text" class="FormInput" id="adresse2" size="50" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td>Code postal* : </td>
<td><input name="codePostal" type="text" class="FormInput" id="codePostal" size="10" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td>Ville* : </td>
<td><input name="ville" type="text" class="FormInput" id="ville" size="30" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td>Votre message : </td>
<td><textarea name="message" cols="45" class="FormInput" id="message" onKeyUp="javascript:couleur(this);" /></textarea></td>
</tr>
<tr>
<td colspan="2"> </td>
</tr>
<tr>
<td>Vous préférez être recontacté : </td>
<td><select name="moyenContact" class="FormInput" id="moyenContact" onKeyUp="javascript:couleur(this);" />
<option>Sélectionnez une valeur</option>
<option value="Téléphone">Téléphone</option>
<option value="Email">Email</option>
</select></td>
</tr>
<tr>
<td>Indiquez votre téléphone* :</td>
<td><input name="telephone" type="text" class="FormInput" id="telephone" size="30" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td>ou votre email* :</td>
<td><input name="email" type="text" class="FormInput" id="email" size="30" onKeyUp="javascript:couleur(this);" /></td>
</tr>
<tr>
<td> </td>
<td align="right"><input name="envoyer" type="image" id="envoyer" style="border: 0" src="data/image/contact/but_envoi_message.png" width="199" height="32" tabindex="11" /></td>
</tr>
</table>
</form>
Cela fait deux jours que je cherche en vain. Pouvez-vous m'orienter ?
Merci d'avance pour votre aide !
Répondre avec citation
Partager