Je tente de faire un peu de javascript pour faire du traitement d'erreurs dans un formulaire,et après quelques recherche j'ai put adapter des scripts trouvés sur la toile.
Tout fonctionne très bien avec firefox mais pas franchement avec IE.
Mon soucis est que je ne sais pas ou ni quoi chercher a corriger dans mon script.
Si vous avez des pistes je vous en serais grès.
Merci d'avance.
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<title>Test de vérification de formulaire</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" media="screen" href="style.css" />
<script type="text/JavaScript">
<!--
function check() {
var msg = "";
var message = "";
var messagelc = "";
var corde = document.formulaire.Lcorde.value;
var r = document.formulaire.rayon.value;
if (corde == "" ) {
msg += "Veuillez saisir une longueur de corde \n";
}
if ( !IsNumeric (corde)) {
msg += "Votre longueur de corde doit être un nombre\n";
}
if (r == "") {
msg += "Veuillez saisir un rayon \n";
}
if ( !IsNumeric (r)) {
msg += "Votre rayon doit être un nombre\n";
}
if (msg == "") return(true)
else {
alert(msg);
return(false);
}
}
function IsNumeric(sText)
//vérifie si la chaine envoyée est de type numérique
{
var ValidChars = "0123456789.";
var IsNumber=true;
var Char;
for (i = 0; i < sText.length && IsNumber == true; i++)
{
Char = sText.charAt(i);
if (ValidChars.indexOf(Char) == -1)
{
IsNumber = false;
}
}
return IsNumber;
}
function Verif_rayon(champ)
{
if(document.getElementById){
var message = "";
var rayon = "";
var rayon = document.formulaire.rayon.value ;
if ( IsNumeric(rayon) && rayon !== "" )
{
if ( document.formulaire.rayon.value >= document.formulaire.Lcorde.value/2 )
{ message ="<b class ='alert'>Votre rayon doit être inférieur à : ";
message += document.formulaire.Lcorde.value/2;
message +="<\/b>)";
msg += "Votre rayon doit être inférieur à :";
msg += document.formulaire.Lcorde.value/2 ;
document.formulaire.rayon.style.backgroundColor = "#FF4116";
document.getElementById(champ).innerHTML = message;
}
if(document.formulaire.rayon.value <= document.formulaire.Lcorde.value/2 && document.formulaire.rayon.value !== "")
{ message =" (<b class ='valide'>OK, votre rayon est inferieur à : ";
message += document.formulaire.Lcorde.value/2;
message +="<\/b>)";
document.getElementById(champ).innerHTML = message;
document.formulaire.rayon.style.backgroundColor = "#32FF1F";
}
}
else{
message =" (<b class ='alert'>Vous devez mettre un nombre inférieur à ";
message += document.formulaire.Lcorde.value/2;
message +="<\/b>)";
document.getElementById(champ).innerHTML = message;
document.formulaire.rayon.style.backgroundColor = "#FF4116";
}
}
}
function Verif_lcorde(champ)
{
if(document.getElementById){
var lcorde = document.formulaire.Lcorde.value ;
if ( !IsNumeric (lcorde) || lcorde =="")
{ messagelc =" (<b class ='alert'>Vous devez mettre un nombre!!!<\/b>) ";
document.getElementById(champ).innerHTML = messagelc;
document.formulaire.Lcorde.style.backgroundColor = "#FF4116";
}
else{ messagelc =" (<b class ='valide'>OK<\/b>) ";
document.getElementById(champ).innerHTML = messagelc;
document.formulaire.Lcorde.style.backgroundColor = "#32FF1F";
}
}
}
//-->
</script>
</head>
<body>
<form action="" method="post" enctype="application/x-www-form-urlencoded" name="formulaire" onsubmit="return check();">
Longueur de corde : <input name="Lcorde" type="text"
onmouseover="Verif_lcorde('Lcorde');"
onchange="Verif_lcorde('Lcorde');"
onkeypress="Verif_lcorde('Lcorde');"
onmouseout="Verif_lcorde('Lcorde');" /> mm.
<a id="Lcorde"></a><br />
Rayon : <input name="rayon" type="text"
onmouseover="Verif_rayon('rayon');"
onchange="Verif_rayon('rayon');"
onmouseout="Verif_rayon('rayon');" /> mm.
<a id="rayon"></a><br />
<input type="submit" name="Submit" value="Envoyer" />
</form>
</body>
</html>
