Afficher message javascript [Résolu/Fermé]

Signaler
Messages postés
30
Date d'inscription
jeudi 11 mars 2010
Statut
Membre
Dernière intervention
28 octobre 2011
-
Messages postés
30
Date d'inscription
jeudi 11 mars 2010
Statut
Membre
Dernière intervention
28 octobre 2011
-
Bonjour,

Je viens de réaliser un formulaire et avant de l'envoyer, je test si tous les champs sont bien remplis avec du javascript. Jusqu'ici tout va bien !
Par contre mon problème c'est que lorque j'ai une erreur dans un champ, j'affiche un message d'alerte dans une fenetre popup mais je souhaiterai afficher le message dans ma page ou se trouve le formulaire sans recharger le page, comment faire ? Faire comme un "echo" mais en javascript ?

Voici le code :

<script language="JavaScript">
// Teste si le mail a une forme correcte
function checkmail(Email) {
var reg = /^[a-z0-9._-]+@[a-z0-9.-]{2,}[.][a-z]{2,4}$/
return (reg.exec(Email)!=null)
}
// Teste le contenu des champs du form avant submit
function test(Nom,Prenom,Email,Message) {
if(Nom.value=="Votre Nom*") {
alert("Veuillez renseigner votre Nom"); Nom.focus(); return false;
} else if(Prenom.value=="Votre Prénom*") {
alert("Veuillez renseigner votre Prénom"); Prenom.focus(); return false;
} else if(!checkmail(Email.value)) {
alert("Format Email incorrect"); Email.focus(); return false;
} else if(Message.value=="") {
alert("Veuillez rédiger votre message"); Message.focus(); return false;
}
return true;
}
</script>


6 réponses

Messages postés
2064
Date d'inscription
vendredi 29 juin 2007
Statut
Contributeur
Dernière intervention
7 décembre 2017
711
Salut!

Ton code me parait mal fait surtout au niveau de la vérification des champs car tu verifie si les champs texte ont une valeur. par exemple ( (Nom.value=="Votre Nom*") ) or là ça ne vérifie pas si le champs est vide. en ce qui concerne ce que tu veux faire,j'ai un code quile fait mais je vais fouiller.entre temps, montre moi ton formulaire.

Cdt
Messages postés
30
Date d'inscription
jeudi 11 mars 2010
Statut
Membre
Dernière intervention
28 octobre 2011
1
voila mon formulaire

<form method=POST onSubmit="return test(this.Nom,this.Prenom,this.Email,this.Message)"
action=traitement.php>

<tr><td colspan="3" align="center">
<input type=text name=Nom value="Votre Nom*" size=60
style="border:none; background:#FFFFFF; font-family:Arial, Helvetica, sans-serif; color:#666666"
onfocus="if(this.value == 'Votre Nom*'){this.value = '';}"
onBlur="if(this.value == ''){this.value = 'Votre Nom*';}"/>
</td></tr>

<tr><td colspan="3" align="center"> <br />
<input type=text name=Prenom value="Votre Prénom*" size=60
style="border:none; background:#FFFFFF; font-family:Arial, Helvetica, sans-serif; color:#666666"
onfocus="if(this.value == 'Votre Prénom*'){this.value = '';}"
onBlur="if(this.value == ''){this.value = 'Votre Prénom*';}"/>
</td></tr>

<tr><td colspan="3" align="center"> <br />
<input type=text name=Email value="Votre Email*" size=60
style="border:none; background:#FFFFFF; font-family:Arial, Helvetica, sans-serif; color:#666666"
onfocus="if(this.value == 'Votre Email*'){this.value = '';}"
onBlur="if(this.value == ''){this.value = 'Votre Email*';}"/>
</td></tr>

<tr><td colspan="3" align="center"> <br />
<input type=text name=Telephone value="Votre Téléphone" size=60
style="border:none; background:#FFFFFF; font-family:Arial, Helvetica, sans-serif; color:#666666"
onfocus="if(this.value == 'Votre Téléphone'){this.value = '';}"
onBlur="if(this.value == ''){this.value = 'Votre Téléphone';}"/>
</td></tr>

<tr><td colspan="3" align="center"> <br />
<textarea rows="6" name=Message style="width:100%; border:none; background:#FFFFFF; font-family:Arial, Helvetica, sans-serif; color:#666666; font-size:13px"></textarea>
</td></tr>

<tr><td colspan="3"> </td></tr>

<tr><td align="center" width="87" height="25" bgcolor="#31859C">
<input type=submit value=ENVOYER class="texte_blanc" style="border:none; background:#31859C;">
</td>
<td width="176"> </td>
<td align="center" width="87" bgcolor="#31859C">
<input type=reset value=EFFACER class="texte_blanc" style="border:none; background:#31859C;">
</td></tr>

</form>
Messages postés
3926
Date d'inscription
jeudi 5 février 2009
Statut
Membre
Dernière intervention
27 octobre 2017
905
bonjour jeremyyyyy
en lieu et place de tes alert
tu peux faire comme çà :
avec ou il faut une <div id="info"></div>
si tu utilise jquery:
$("#info").hide().html('').append('ton txt');
$("#info").fadeIn();
sinon
document.getElementById("info").innerHTML = 'ton txt';
Messages postés
30
Date d'inscription
jeudi 11 mars 2010
Statut
Membre
Dernière intervention
28 octobre 2011
1
désolé, je suis débutant et je ne comprend pas vraiment...
Messages postés
5358
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
887
pour exemple une partie de ton code completé
( remarque tu dois mettre les valeurs des attributs entre " ex name="Nom" )

<form method=POST onSubmit="return test(this.Nom,this.Prenom,this.Email,this.Message)" 
action=traitement.php> 

<tr><td colspan="3" align="center"> 
<input type="text" name="Nom" value="Votre Nom*" size=60 
style="border:none; background:#FFFFFF; font-family:Arial, Helvetica, sans-serif; color:#666666" 
onfocus="if(this.value == 'Votre Nom*'){this.value = '';}" 
onBlur="if(this.value == ''){this.value = 'Votre Nom*';}" />
 <span id="Nom"><!-- c'est la que va s'afficher ton message d'alerte Nom --></span>
</td></tr> 

<tr><td colspan="3" align="center"> <br /> 
<input type="text" name="Prenom" value="Votre Prénom*" size=60 
style="border:none; background:#FFFFFF; font-family:Arial, Helvetica, sans-serif; color:#666666" 
onfocus="if(this.value == 'Votre Prénom*'){this.value = '';}" 
onBlur="if(this.value == ''){this.value = 'Votre Prénom*';}" /> 
<span id="Nom"><!-- c'est la que va s'afficher ton message d'alerte Prenom --></span></td></tr> 

fais pareil pour les autres


et ton javascript:

<script language="JavaScript"> 
// Teste si le mail a une forme correcte 
function checkmail(Email) { 
var reg = /^[a-z0-9._-]+@[a-z0-9.-]{2,}[.][a-z]{2,4}$/ 
return (reg.exec(Email)!=null) 
} 
// Teste le contenu des champs du form avant submit 
function test(Nom,Prenom,Email,Message) { 
if(Nom.value =="" OR Nom.value=="Votre Nom*") { 
//alert("Veuillez renseigner votre Nom"); 
document.getElementById(Nom).innerHTML="<font color="red">Veuillez renseigner votre Nom</font>";
Nom.focus();
 return false; 
} else if(Prenom.value=="" OR Prenom.value=="Votre Prénom*") { 
//alert("Veuillez renseigner votre Prénom"); 
document.getElementById(Prenom).innerHTML="<font color="red">Veuillez renseigner votre Prénom</font>";
Prenom.focus(); 
return false; 
/////tu fais pareil pour les autres ////
} else if(!checkmail(Email.value)) { 
alert("Format Email incorrect"); Email.focus(); return false; 
} else if(Message.value=="") { 
alert("Veuillez rédiger votre message"); Message.focus(); return false; 
} 
return true; 
} 
</script> 
Messages postés
30
Date d'inscription
jeudi 11 mars 2010
Statut
Membre
Dernière intervention
28 octobre 2011
1
Ah cool merci beaucoup c'est exactement ce que je voulais faire.
Merci les ami(e)s ;)