javascript validation de case à cocher

La validation de la case à cocher ne fonctionne pas. Il ne donne pas d'erreur. Pourriez-vous svp m'aider à résoudre ce problème? Et comment puis-je combiner des erreurs dans l'une alerte au lieu de un par un?

Merci pour toute aide.

Code Html:

<form class="contact_form" action="" method="post" name="contact_form" onsubmit="returnonFormSubmit(this)">
<li>
<label for="First Name">First Name:</label>
<input type="text" name="visitor_name" /><br />
</li>
<li>
<label for="condition">I agree with the terms and conditions.</label>
<input type="checkbox" name="lan" /><br />
</li>
<li>
<label for="Male">Male:</label>
<input type="radio" name="gender" value="m" /> &nbsp; Female:<input type="radio" name="gender" value="f" /><br />
</li>
<li>
<label for="National Rating">National Rating:</label>
<select name="make">
<option selected>-- SELECT --</option>
<option> Below 1200 </option>
<option> 1200 - 1500 </option>
<option> 1500 - 1800 </option>
<option> 1800 - 2100 </option>
<option> Above 2100 </option>
</select><br />
</li>
<li>
<button class="submit" type="submit">Submit</button>
</li>
<div id="error_message" style="color:#ff0000;"></div>

code javascript: 

    function onFormSubmit(form_element)
{
var checked = 0;
var letters = /^[a-zA-Z]+$/;
if (form_element.visitor_name.value.match(letters))
{
true;
}
else
{
alert("Please enter a valid first name. For example; John.");
false;
}
if (form_element.lan.checked == false)
{
alert("Please accept the terms and conditions");
false;
}
if (form_element.gender[0].checked == false && form_element.gender[1].checked == false)
{
alert("Please select a gender.");
false;
}
if (form_element.make.selectedIndex == 0)
{
alert("Please select your rating interval.");
form_element.make.focus();
false;
}
return true;
}
  • vous avez besoin d'utiliser return X; (et non pas simplement X;) et vous avez une faute de frappe sur onsubmit="returnonFormSubmit(this)"
InformationsquelleAutor pepsicode | 2012-04-22
  1. 1

    Vous devriez concaténer les messages d'erreur dans une variable.

    function onFormSubmit(form_element)
{
var checked = 0;
var letters = /^[a-zA-Z]+$/;
var errorMessage = "";
if (!form_element.visitor_name.value.match(letters))
{
errorMessage += "Please enter a valid first name. For example; John.\n";
}
if (form_element.lan.checked == false)
{
errorMessage += "Please accept the terms and conditions\n";
}
if (errorMessage != "")
{
alert(errorMessage);
return false;        
}
return true;
}​
    InformationsquelleAutor jorgebg
  2. 1

    Vous avez une erreur de frappe dans la onsubmit="returnonFormSubmit(this)". Il devrait être 

    onsubmit="return onFormSubmit(this)"

    L'exécution de cette avec une console ouverte serait de vous donner un précieux erreur/d'avertissement. Essayez google Chrome Developer Tools, Firefox' Firebug ou similaire.

    De combiner les erreurs en un seul, vous pourriez commencer avec une chaîne vide msg = '' et ajouter si il y a une erreur. Ensuite, en bas de votre fonction, alert(msg) et retournera false si elle est non vide, sinon renvoie la valeur true.

    • Il a été onsubmit="return onFormSubmit(ce)". Lors de la copie ici, j'ai fait une erreur. Merci.
    • Ce n'Outils de développement ou Firebug dire? Vous avez peut-être une autre erreur de syntaxe dans votre code.
    InformationsquelleAutor Kleist
  3. 1

    Après correction de faute de frappe dans returnonFormSubmit(ce), il fonctionne dans Chrome et Firefox.

    (BTW: vous oubliez les retours)

    De combiner les alertes, je voudrais utiliser un tableau.
    Exemple:

    function onFormSubmit(form_element)
{
var checked = 0;
var letters = /^[a-zA-Z]+$/;
var alerts = new Array();
if (!form_element.visitor_name.value.match(letters))
alerts.push("Please enter a valid first name. For example; John.");
if (!form_element.lan.checked)
alerts.push("Please accept the terms and conditions");
if (alerts.length == 0) {
return true;
}
alert(alerts.join("\n"));
return false;
}
    • j'ai édité ma question. pourriez-vous s'il vous plaît vérifier? J'apprécie votre aide.
    InformationsquelleAutor Kveri