11548 sujets

JavaScript, DOM et API Web HTML5

Problème avec un bouton JavaScript et une vérification de formulaire

Bonjour,

Dans un formulaire, je fais une vérification JS afin de m'assurer que les champs obligatoires sont remplis :


function verifChamps() {


if ( document.confirmer.listepaysajout.options[document.confirmer.listepaysajout.
selectedIndex].value == "0" ) {

alert("Veuillez choisir un pays");
return false;
}

if ( document.confirmer.listetypeajout.options[document.confirmer.listetypeajout.
selectedIndex].value == "0" ) {

alert("Veuillez choisir un type d'annonce");
return false;
}

if ( document.confirmer.listebatajout.options[document.confirmer.listebatajout.
selectedIndex].value == "0" ) {

alert("Veuillez choisir un type de bien");
return false;
}


if (document.confirmer.nomfam.value == "") {
		document.confirmer.nomfam.style.backgroundColor = "#fba";	
		document.confirmer.nomfam.focus();
		return false;
	} 
	
if (document.confirmer.email.value == "") {
		document.confirmer.email.style.backgroundColor = "#fba";
		document.confirmer.email.focus();
		return false;
	}


A la fin du formulaire, j'ai 2 boutons "Annuler" et "Valider" que j'ai mis ainsi afin de pouvoir les remplacer par une image :


<img src="img/annuler.png" onclick=javascript:document.confirmer.reset(); BORDER=0> 
<img src="img/valider.png" onclick=javascript:document.confirmer.submit(); BORDER=0>


Seulement, avec ces boutons, ma vérification ne fonctionne plus. Avez-vous une idée de ce que c'est?
Salut,

Si tu invoques verifChamps() via un onsubmit sur ton formulaire, c'est normal :
<img onclick=document.confirmer.submit();>
L'événement submit n'est déclenché que lors d'une soumission "naturelle" du formulaire (clic de l'utilisateur sur un contrôle de type submit/image). Si tu soumets le formulaire à la mano, dans ton code js (form.submit()), ça ne déclenche pas d'événement submit.

Solution : dans ton onclick, il faut appeler explicitement la validation, un peu comme ça :
onclick="if (verifChamps()) document.confirmer.submit() "
Ok, ça me fait toutes les vérifications JavaScript par contre une fois que j'ai tout qui est bien rempli, il m'envoie pas le formulaire. Faut-il que je rajoute quelque chose de plus?

Voici le code des boutons :


<img src="img/annuler.png" onclick="if (verifChamps()) document.confirmer.reset() " BORDER=0> 
<img src="img/valider.png" onclick="if (verifChamps()) document.confirmer.submit() " BORDER=0>
Tu peux mettre ta page en ligne pour qu'on puisse jeter un oeil ?

Sinon, remplace :
<img src="img/valider.png" onclick="if (verifChamps()) document.confirmer.submit() " BORDER=0>
par 
<img src="img/valider.png" onclick="if (verifChamps()) {alert('ok'); document.confirmer.submit();} " BORDER=0>
Si, avec tous les champs justes, tu cliques sur l'image, une alerte 'ok' devrait apparaître :

- si elle apparait et que ton formulaire ne se soumet pas, le problème est dans la ligne document.confirmer.submit() trouve ce qui déconne, c'est probablement le ciblage de ton formulaire (essaye document.getElementById(idFormulaire)).

- si l'alerte 'ok' n'apparaît pas, vérifie bien que verifChamps() renvoie true lorsque tous les champs sont justes.
Alors j'ai re-vérifié ma fonction, c'est pas elle qui déconne. Avant d'utiliser un bouton avec image, j'avais des boutons tous simples "submit" et "reset" et ça marchait niquel.

Donc j'ai tenté le getElementById et rien n'y fait.

Voici la page :

http://www.immova.fr/ajout.php

Je te remercie de ton aide
if (verifChamps()) {alert('ok'); document.getElementById(confirmer));}
Euh... Smiley sweatdrop Quand je te dis d'essayer document.getElementById(idFormulaire), c'est un raccourci. Il faut que tu comprennes un mimimum ce que ça fait, quand même... Ne prends pas mal ma question (vraiment), mais as-tu des rudiments de javascript ou as-tu simplement copié/collé ton code ?

En attendant, teste ça :
- dans la balise <form> de ton formulaire, s'il y a un attribut id mémorise-le, sinon donne-lui en un (avec la valeur que tu veux)
- ensuite, la ligne dont je te parlais, au début de ce post, remplace-la par :
if (verifChamps()) {alert('ok'); document.getElementById("blablabla").submit();}
... en prenant soin de remplacer blablabla par l'id de ton formulaire (laisse les guillements, par contre).

Ensuite si, avec tous les champs justes, tu cliques sur l'image, est-ce qu'une boite de dialogue avec "ok" apparaît ?
Sujet clos
Aller à