I need to do a very basic form validation, and my method of choice is jQuery. However, for some reason, the validation function seems not to get fired at all.
After looking at this for several hours I can’t find out what the problem is.
HTML:
<form id="form1" name="form1" method="post" action="process.php">
<table width="100%" border="0" cellspacing="5" cellpadding="0">
<tr>
<td width="160">Meno:</td>
<td><input type="text" name="meno" id="meno" /></td>
<td width="160">Priezvisko:</td>
<td><input type="text" name="priezvisko" id="priezvisko" /></td>
</tr>
<tr>
<td width="160">Názov spolocnosti: <br />
<span class="register_comment">(nevyplnajte ak nie ste podnikatel)</span></td>
<td><input type="text" name="spolocnost" id="spolocnost" /></td>
<td width="160">Krajina:</td>
<td><select name="krajina" id="krajina">
<option value="" selected="selected"> </option>
<option value="cz">Ceská republika</option>
<option value="sk">Slovenská republika</option>
</select></td>
</tr>
<tr>
<td width="160">Adresa:</td>
<td><input type="text" name="adresa" id="adresa" /></td>
<td width="160">Mesto:</td>
<td><input type="text" name="mesto" id="mesto" /></td>
</tr>
<tr>
<td width="160">Email:<br />
<span class="register_comment">(na tento email Vám príde potvrdenie)</span></td>
<td><input type="text" name="email" id="email" /></td>
<td width="160">Telefonický kontakt:<br />
<span class="register_comment">(uvádzajte kontakt na mobilný telefón na ktorom budete zastihnutelní najmä 10.10.!)</span></td>
<td><input type="text" name="telefon" id="telefon" /></td>
</tr>
<tr>
<td width="160">Miesto nástupu: </td>
<td colspan="3"><select name="nastup" id="nastup">
<option value="" selected="selected"> </option>
<option value="nr">Nitra</option>
<option value="ba">Bratislava</option>
<option value="br">Brno - Avion Shopping Park, Škandinávská 128/2</option>
<option value="ph">Praha - Avion Shopping Park, Škandinávská 15/A</option>
<option value="pl">Plzen - OC Olympia, Písecká 972/1</option>
</select></td>
</tr>
<tr>
<td colspan="4"><p>
<label>
<input type="checkbox" name="suhlas" value="checkbox" id="suhlas" />
Oboznámil som sa s podmienkami úcasti a Súhlasím s podmienkami úcasti </label>
FLEX Polishing Camp<br />
</p></td>
</tr>
<tr>
<td colspan="4" align="center"><input type="submit" id="button" value="Odoslat záväznú prihlášku na FLEX Polishing Camp" style="width:500px;" /></td>
</tr>
<tr>
<td colspan="4" class="register_comment">xxxx</td>
</tr>
</table>
</form>
jQuery:
<script>
$("#form1").submit(function() {
var errors = new array();
if ($('input[name=meno]').val() == "") {
errors.push('Meno je povinná položka.');
}
if ($('input[name=priezvisko]').val() == "") {
errors.push('Priezvisko je povinná položka.');
}
if ($('input[name=krajina]').val() == "") {
errors.push('Je nutné vybrať si krajinu - ČR alebo SR.');
}
if ($('input[name=adresa]').val() == "") {
errors.push('Adresa je povinná položka.');
}
if ($('input[name=mesto]').val() == "") {
errors.push('Mesto je povinná položka.');
}
if ($('input[name=email]').val() == "") {
errors.push('Email je povinná položka.');
}
if ($('input[name=telefon]').val() == "") {
errors.push('Telefonický kontakt je povinná položka.');
}
if ($('input[name=nastup]').val() == "") {
errors.push('Telefonický kontakt je povinná položka.');
}
if (!$('#suhlas').attr('checked')) {
errors.push('Je potrebné vysloviť súhlas s podmienkami zaškrtnutím tlačítka "Oboznámil som sa s podmienkami účasti a Súhlasím s podmienkami účasti FLEX Polishing Camp".');
}
if ( errors.lenght > 0 )
{
var text;
for (var i = 0; i < errors.length; i++) {
text = text + errors[i] + '\n';
};
alert(text);
return false;
}
return true;
});
</script>
As other mention you have missed the
#for your ID selector, you can also usemapmethod and minify your code.http://jsfiddle.net/bwVWQ/