Menu

Checkbox avant validation formulaire PHP [Résolu/Fermé]

Messages postés
45
Date d'inscription
vendredi 6 mars 2009
Statut
Membre
Dernière intervention
11 janvier 2013
- - Dernière réponse : mod77
Messages postés
1261
Date d'inscription
vendredi 10 juillet 2009
Statut
Membre
Dernière intervention
22 octobre 2018
- 15 mars 2010 à 08:38
Bonjour,

j'ai un formulaire PHP ou je voudrais que l'utisateur coche une case avant de valider son formulaire.
quand je la mets checked, c pas evident parceque l'utilisateur doit la cocher lui meme,
sinon je recois une erreur comme quoi la variable n'est pas definies, je voudrais que la validation se fasse si et seulement si l'utilisateur coche la case, et sinon lui afficher sur la meme page du formulaire une indication pour la cocher, et merci
Afficher la suite 

3 réponses

Meilleure réponse
Messages postés
246
Date d'inscription
mercredi 4 mars 2009
Statut
Membre
Dernière intervention
13 mars 2009
24
3
Merci
Tiens, j'ai fais exactement la même chose sur ce site :
http://www.citevoile-tabarly.com/contact.html

Impossible d'envoyer le formulaire tant que la case à cocher de la clause de confidentialité n'a pas été cochée

Dire « Merci » 3

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

CCM 39055 internautes nous ont dit merci ce mois-ci

saadainese
Messages postés
45
Date d'inscription
vendredi 6 mars 2009
Statut
Membre
Dernière intervention
11 janvier 2013
1 -
Bonjour,
Merci Dolmenhir, j'ai vu le lien, et je crois que c'est vraiment une bonne idée que l'utilisateur ne puisse valider que s'il coche la case, si tu pouvais donner plus d'explication sur la methode que tu as utilisé, j'en serait vraiment content,
dolmenhir
Messages postés
246
Date d'inscription
mercredi 4 mars 2009
Statut
Membre
Dernière intervention
13 mars 2009
24 > saadainese
Messages postés
45
Date d'inscription
vendredi 6 mars 2009
Statut
Membre
Dernière intervention
11 janvier 2013
-
Bonsoir,
La recette est très simple.
Je ne parlerai pas de la formule de vérification du formulaire, voisine de cette que décris Alain_42
Elle n'est pas obligatoire... mais cela rend bien service quand même de vérifier s'il les champ sont bien saisis, voir même si leur type contenu correspond à ce que l'on attend (lettre, chiffre, email...)

Bon, ma procédure d'activation/désactivation du bouton submit (et donc de la fonction submit) est la suivante :(en la relisant je me suis rendu compte qu'elle avait une grosse lacune. Je l'ai corrigée et un peu dépoussiérée.)

1. je crée une fonction appelée ici Agree
function Agree() {
	if(document.contact.agree.checked == true) {
		document.contact.valid.disabled = false;
	} else {
		document.contact.valid.disabled = true;
	} 
}

Elle vérifie une condition :
le statut "checked" de l'élément portant le nom "agree' du formulaire "contact" du document en cours (document.contact.agree.checked) est-il vrai (true) ?
Si oui, le statut "disabled" de l'élément "valid" du formulaire "valid" du document en cours est mis à false (faux), donc activé: document.contact.valid.disabled = false
Bref, si la case est cochée j'active le bouton

Sinon (else)

Cela signifiq ue la case n'est pas cochée (pas true) et donc le statut "disabled" de l'élément "valid" du formulaire "valid" du document en cours est mis à true (vrai), donc désactivé: document.contact.valid.disabled = true
bref, si la case n'est pas cochée le bouton est désactivé.

J'appelle cette procédure quand on clique sur la case, donc je place dans l'objet un appel à cette procédure :
onClick="Agree()"

Mais !
J'ai mis un bouton Annuler, sensé lancer un "reset() et donc remettre à zéro ou à leur valeur d'origine (celle indiqué par l'attribut value de l'objet) les éléments du formulaire .
Cela veut dire qu'il faut là aussi, tester la valeur de la case à cocher : onClick="Agree().
Donc, je remet à zéro et je teste la valeur de la case à cocher.
Certes, je sais, que la case sera remise à son état initial donc décochée (mon formulaire s'ouvre ainsi.
Mais si je ne fais pas cette vérification, le bouton d'envoi sera activé... Pourquoi ?
parce que en cochant la case, je l'active, et en cliquant sur Annuler je remets les champs à "zéro"...
Mais l'état désactivé du bouton n'est pas une valeur, mais un statut... il ne sera donc pas impacté.

Donc, pour résumer, si je ne mets pas onClick="Agree() dans le bouton Annuler, il suffit de cocher la case puis de faire Annuler pour pouvoir envoyer le formulaire.

J'espère que reste clair dans mes explications, mais par l'exemple, les choses sont vite évidentes.

Dernière chose, je mets pas (voire jamais) de bouton submit, ni reset.
J'utilise des objets de type "button" dans lesquels je place l'appel de la procédure concernée :on reset() et onSubmit()
Pourquoi ?
Parce que dans un formulaire disposant d'un vrai bouton submit, une simple pression de la touche "Enter" du clavier, peut suffire à envoyer le message... et je n'y tiens pas.
Par ailleurs, pour embêter certains robots, la procédure submit() requiert une action coté utilisateur.

Voilà, en espérant t'avoir éclairé.

Dol.
mod77
Messages postés
1261
Date d'inscription
vendredi 10 juillet 2009
Statut
Membre
Dernière intervention
22 octobre 2018
40 > dolmenhir
Messages postés
246
Date d'inscription
mercredi 4 mars 2009
Statut
Membre
Dernière intervention
13 mars 2009
-
Bonjour Dolmenhir,

Au cours de ma recherche sur le site je viens de lire votre proposition qui m'intéresse aussi mais sur Access.
Car je cherche aussi comment je peux impliquer "le cochage" d'une case à cocher lors d'une validation. Pour éviter de poser la question à l'utilisateur. Mais même en posant la question ça m'intéresse!
Seriez-vous adapter votre code à Access, SVP ?

Merci
Messages postés
5374
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
862
0
Merci
pour ça tu peux utiliser du javascript

tu mets au début de ta page:

<script type="text/javascript">
function verif_case(id_case){
 var obj=document.getElementById(id_case);
if(obj.checked!=true){
  alert("Vous devez cocher la case !!");
  return false;
}
return  true
}

</script>

et dans ton formulaire:

<form name="...." method="...." action="..." onSubmit="return verif_case('case1');">
<input type="checkbox" name="...." id="case1" value="...">


</form>


ainsi si la case n'est pas cochéee le formlaire ne partira pas et tu aura un message d'alerte
saadainese
Messages postés
45
Date d'inscription
vendredi 6 mars 2009
Statut
Membre
Dernière intervention
11 janvier 2013
1 -
Bonjour,
Merci Alain pour ta reponse meme si je n'ai pas pu la mettre en oeuvre, je valide un email avant et donc j'appelle ma fonction dans onsubmit de mon formulaire et je ne pe pa mettre les deux, sinon je l'ai essayé seule, mais avec cette id_case je sais pas par quoi la changer, en plus mon checkbox n'avait pas d'ID je viens de la lui ajouter, il y'a aussi l'attribut name, est ce que le name ne fait pas l'affaire ?
Messages postés
5374
Date d'inscription
dimanche 3 février 2008
Statut
Membre
Dernière intervention
13 février 2017
862
0
Merci
Bonsoir,

dans une fonction tu peux faire plusieurs tests

chaque test negatif te return false donc empèche le formulaire de partir
si tous les tets sont ok return true donc le form part

c'est le rôle de return devant verifs() dans l'appel de la fct

ensuite concernant name et id d'un input

tu peux mettre les deux et de plus avec le même nom, mais ce n'est pas obligatoire qu'ils soient identiques

en Javascript on peut atteindre un élément de la page html de deux façons:

- par l'id document.getElementById('nom_de_l'id')

- par le name document.nom_formulaire.name_d_champ

perso je préfère la première solution

exemple:

<script type="text/javascript">
function verifs(){
	////// un bloc pour tester un champ
	var obj1=document.getElementById('email');
	if(obj1.value==""){
	  alert("Vous devez saisir votre email!!");
	  return false;
	}
	/////
	//tu mets autant de blocs de test que de champs à tester
	//test validité email
		var exp=new RegExp("^[\\w\\-]+(\\.[\\w\\-]+)*@[\\w\\-]+(\\.[\\w\\-]+)*\\.[\\w\\-]{2,}$", "i");
		if(obj1.value !="" && !exp.test(obj1.value.value)){

	 var obj2=document.getElementById('case1');
	if(obj2.checked!=true){
	  alert("Vous devez cocher la case !!");
	  return false;
	}
return  true
}

</script>

et dans ton formulaire:

<form name="...." method="...." action="..." onSubmit="return verifs();">
<input type="text" name="email" id="email" value="">
<input type="checkbox" name="...." id="case1" value="...">


</form>