[javascript] button
Résolu
Bonsoir à tous !,
L'utilisateur doit remplir un formulaire. je verifie ce formulaire avec une fonction js. Voila le code HTML et le js qui vérifie si le formulaire est correctement remplit :
et sur ma page2.php j'aimerais qu'il effectue les opérations si on clique sur ce bouton
Mais cela ne fonctionne pas. Biensur en mettant un input type submit à la place de button cela fonctionne mais il me dirigera vers la page2 même si le formualire n'est pas correctement remplit ! (peut être existe -t-il une fonction qui empêche d'envoyer ?)
Merci !
L'utilisateur doit remplir un formulaire. je verifie ce formulaire avec une fonction js. Voila le code HTML et le js qui vérifie si le formulaire est correctement remplit :
<script language="JavaScript">
function VerifForm(formulaire)
{
if (.................................)
{
document.monform.submit();
}
else
{
alert("Formulaire non complété intégralement !");
}
}
</script>
<form action="page2.php" method="POST" name="monform">
/* differents input type */
<input type="button" value="Créer" name="creer" onClick="VerifSelect(this)" />
</form>
et sur ma page2.php j'aimerais qu'il effectue les opérations si on clique sur ce bouton
if(!empty($_POST['creer']))
{
echo 'c ok ';
}
Mais cela ne fonctionne pas. Biensur en mettant un input type submit à la place de button cela fonctionne mais il me dirigera vers la page2 même si le formualire n'est pas correctement remplit ! (peut être existe -t-il une fonction qui empêche d'envoyer ?)
Merci !
Configuration: Windows XP Firefox 3.0.4
3 réponses
-
J'ai toujours du mal à choisir entre = et ==.
En tout merci ! Ça fonctionne ! -
Salut,
je te propose la version "DOM level 2", libre à toi de l'adopter ou pas. Si tu trouves ça trop prise de tête, laisse béton, je t'en voudrai pas :P
Doc : http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-eventgroupings-htmlevents
On s'intéresse à l'évènement submit.
On l'attache comme suit (ne marche pas sous IE) :document.getElementById('monForm').addEventListener('submit', verifierForm, false);
Il faut avoir (au préalable) défini une fonction verifierForm() :function verifierForm(e) { // l'évènement est passé en argument if ( ...form non complet... ) { alert('pas bien'); e.preventDefault(); } }
La méthode e.preventDefault() annule la soumission du formulaire.
Et j'ai les codes équivalents pour IE, si ça te branche tu me demandes ;) -
Oui
<form action="page2.php" method="POST" name="monform" onSubmit="return VerifForm('monform');"> /* differents input type */ <input type="Submit" value="Créer" name="creer" /> </form>
et ta fct JS:
<script language="JavaScript"> function VerifForm(formulaire) { if (champ1 pas bon) { alert("Champ1 mal rempli !"); return false; } //tu peux répéter ce test if autant de fois que tu as de champs return true; } </script> si la fct retourne false (pas bon) le formulaire ne sera pas envoyé si tout bon elle retourne true donc il part-
Je viens de tester ta solution Alain_42, mais ça n'a pas l'air de fonctionner, je ne voit pas pourquoi ?
<script language="JavaScript"> function VerifForm(formulaire) { var test1 = formulaire.test.value; if (test1="") { alert("Champ non rempli !"); return false; } else { return true; } } </script> <form action="page2.php" method="POST" name="monform" onSubmit="return VerifForm('monform')" > <input type="text" name="test" /> <input type="submit" value="Créer" name="creer" /> </form> -
@ben85350Bonsoir,
petite erreur pour tester il ==
essayes comme ça:
<script language="JavaScript"> function VerifForm(formulaire){ //on atteint l'élément par son id //test champ1 var test1 = document.getElementById('test1').value; if (test1==""){ alert("Champ 1 non rempli !"); return false; } //test champ2 var test2 = document.getElementById('test2').value; if (test1==""){ alert("Champ 2 non rempli !"); return false; } //etc..... //pas besoin du else return true; } </script> <form action="page2.php" method="POST" name="monform" onSubmit="return VerifForm('monform')" > <input type="text" name="test1" id="test1"/> <input type="text" name="test2" id="test2"/> <input type="submit" value="Créer" name="creer" /> </form> -
@Alain_42Bien vu ;)
Si vous êtes familiers avec ce genre d'erreur, faites :if ("" == test1)
Ainsi, si vous ouliez un "=", ça génère une erreur et vous voyez tout de suite où est le problème !
Autre méthode, utiliser l'équivalence booléenne : si test1 est une chaîne vide, dans le if il prendra la valeur false. Il suffit donc de tester :if (!test1)
Plus simple, tu meurs ...
-
