Tester champ formulaire avec javascript [Résolu/Fermé]

Signaler
Messages postés
98
Date d'inscription
mercredi 29 septembre 2010
Statut
Membre
Dernière intervention
21 mai 2014
-
Messages postés
1
Date d'inscription
mardi 11 août 2015
Statut
Membre
Dernière intervention
11 août 2015
-
Bonjour,

j'ai un formulaire de participation dans un site , alors j'ai mis des champs obligatoire pour que l'utilisateur les remplis , donc mon problème est le suivant :

-------> lorsque je lui déclare qu'un champ est vide ou n'est pas correctement remplis , je veux qu'il revient au formulaire mes les champs correctes reste remplissent ,

Voila par la suite une portion de mon code de vérification avec java script :

<script type="text/javascript">
<!--
function valider()
{
var i = 0;

if(form1.nom.value == '' ) {alert('Merci de saisir votre nom');return false;}

if(form1.prenom.value == '') {alert('Merci de saisir votre Prenom');return false;}

if (form1.tele.value.length<2 )
{alert('Ceci n_est pas une Numero de telephone valide');return false;}
}

</script>


Comment peut on faire cette étape & Merci D'avance ^__^

Scout-Boy

4 réponses

Messages postés
5374
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
873
pas besoin de désactiver le bouton submit

il suffit de mettre dans la balise <form sur le submit, une condition qui attend un retour true de la fonction

<form name="..." method="post" action="...." onsubmit="return valider();">

et dans la fonction valider

<script type="text/javascript">
<!--
function valider(){
	if(form1.nom.value == '' ) {
		alert('Merci de saisir votre nom');
		form1.nom.focus(); //met le curseur dans le champ demandé
		return false; //enpèche l'envoi du formulaire
	}

	if(form1.prenom.value == '') {
		alert('Merci de saisir votre Prenom');
		form1.prenom.focus();
		return false;
	}

	if (form1.tele.value.length < 2 ){ //vas voir sur internet ceci n'est pas une verif suffisante pour un numéro de tél si on tape 123 ça passe !
		alert('Ceci n_est pas une Numero de telephone valide');
		form1.tele.focus();
		return false;
	}
	
	//si on est arrivé jusque la c'est que toutes les verif ont été ok donc 
	return true; //autorise l'envoi du formulaire
}
-->
</script>
3
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 63631 internautes nous ont dit merci ce mois-ci

Messages postés
98
Date d'inscription
mercredi 29 septembre 2010
Statut
Membre
Dernière intervention
21 mai 2014

Bonjour ,

le test de champ sa marche , mais le focus et l'empêchement d'envoyer le formulaire ne fonctionne plus , et son enregistrement dans la bdd s'effectue en me déclarent de(s) erreur(s)
Messages postés
98
Date d'inscription
mercredi 29 septembre 2010
Statut
Membre
Dernière intervention
21 mai 2014

Désoler ; ) j'ai commue une erreurs , j'ai mis une double " return True ; "

Ca l'aire fonctionne correctement , merci une autre fois mon ami " ALAIN " ^__^
Messages postés
98
Date d'inscription
mercredi 29 septembre 2010
Statut
Membre
Dernière intervention
21 mai 2014

je ne sais pas pourquoi le test sur le champ de telephone et de cin faire vider tous les autres champs de formulaire ?????????????????????
Messages postés
1
Date d'inscription
mardi 11 août 2015
Statut
Membre
Dernière intervention
11 août 2015

hiiiii!!!!!
J'ai essayer ce code et ça marche mais le probleme est que si on envoie ls informations vers un e-mail tous les valeurs des champs s'envoient meme si la valeur du bouton envoi .
peut quelqu'un m'aider ??!!!
merci d'avance,
Messages postés
5374
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
873
ça vide tous les autres champs parce que ton test n'est pas bon et laisse le formulaire être envoyé.

<script type="text/javascript">   
<!--   
function valider(){   
 if(form1.nom.value == '' ) {   
  alert('Merci de saisir votre nom');   
  form1.nom.focus(); //met le curseur dans le champ demandé   
  return false; //enpèche l'envoi du formulaire   
 }   

 if(form1.prenom.value == '') {   
  alert('Merci de saisir votre Prenom');   
  form1.prenom.focus();   
  return false;   
 }   
    
 ///// un exemple pour tester le numéro de tel   
 var num_tel = form1.tele.value;   

    
 // Le champs est vide   
 if ( num_tel == "" ){   
  alert ( "Le champs téléphone est vide !" );   
  form1.tele.focus();   
 return false;   
 } else{  
    var chiffres = new String(num_tel);    
 // Enlever tous les charactères sauf les chiffres   
 chiffres = chiffres.replace(/[^0-9]/g, '');   
 // Nombre de chiffres   
 compteur = chiffres.length;   
    
 if (chiffres.length != 10){   
  alert("Assurez-vous de rentrer un numéro à 10 chiffres (xxx-xxx-xxxx)");   
  form1.tele.focus();   
 return false;   
 }   
}  
 //// fin test teleph   
    
 //si on est arrivé jusque la c'est que toutes les verif ont été ok donc    
 return true; //autorise l'envoi du formulaire   
}   
-->   
</script>
3
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 63631 internautes nous ont dit merci ce mois-ci

Messages postés
5374
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
873
ou un autre exemple:
///// un autre exemple pour tester le numéro de tel au format français
	var num_tel = form1.tele.value;	
 
	// Le champs est vide
	if ( num_tel == "" ){
		alert ( "Le champs téléphone est vide !" );
		form1.tele.focus();
	return false;
	}else{
		var telRegex = new RegExp (/^(0[1-68])(?:[ _.-]?(\d{2})){4}$/); // Numero francais ( portable compris)
		if (!telRegex.test(num_tel){
			alert("Assurez-vous de rentrer un numéro à 10 chiffres  au format français");
			form1.tele.focus();
			return false;
		}
	}
	//// fin test teleph
Messages postés
34
Date d'inscription
samedi 22 septembre 2012
Statut
Membre
Dernière intervention
15 octobre 2012
2
Tu veux que, lorsque l'utilisateur envoie le formulaire et si un ou plusieurs champs ne sont pas corrects, le navigateur n'envoie pas le formulaire et reste sur la page en affichant qu'il faut ressaisir les infos?

Si c'est le cas, ce que tu essayes de faire est maladroit. Le mieux serait de vérifier à chaque modification des champs, la validité de ces derniers et, s'ils ne sont pas bons, désactiver le bouton submit.

Bien entendu, il faut aussi vérifier les informations utilisateurs en php sur la page d'arrivée car, tu ne seras jamais à l'abris qu'un petit malin s'amuse à trafiquer ton code javascript/ html.

Pour info, pour désactiver un bouton, il s'agit de la propriété disabled. (disabled="disabled")
Messages postés
98
Date d'inscription
mercredi 29 septembre 2010
Statut
Membre
Dernière intervention
21 mai 2014

bonjour,

Oui , Vous m'avez bien compris , mais comment puis je faire un tel test ( bouton inactive jusqu'au faire remplir tous les champ obligatoire du formulaire )

j'espère si vous avez une solution n'hésite plus de m'aider ;)

Merci Beaucoup de me renseigner ' DRAGON '

^__^
Messages postés
34
Date d'inscription
samedi 22 septembre 2012
Statut
Membre
Dernière intervention
15 octobre 2012
2
Sois plus clair.