JQuery form validation with .bind ('submit')
I'm trying to get the form validation and .bind ('submit') (to replace the submit button with a spinner) to play well together.
My JS Code
$.metadata.setType("attr", "validate");
$(document).ready(function() {
$("#selecttest").validate({
rules: {
field: {
required: true,
email: true
}
}
});
$('#selecttest').bind('submit', function() {
$('#div-loading').show();
$('#div-submit').hide();
});
});
and the form:
<form id="selecttest" method="post" action="submit.php">
Please enter your Email:
<input type="email" name="email" id="email" style="font-size: 30px;" class="inputtext required email" size="30" onKeyDown="if(event.keyCode==13) event.keyCode=9;" validate="required:true" title=""><br><br>
<input type="checkbox" name="tos" value="tos" class="required" checked/>I agree to the <a>terms and conditions</a><br>
<div id="div-loading" style="display:none;">
<img src="../images/loading.gif" class="Loading">
</div>
<br>
<div id="div-submit">
<INPUT type="submit" value="Submit" class="ButtonSubmit">
</div>
</form>
And both functions work independently very well, I just can't figure out how to link the second one (show / hide) as it only works after being checked and submitted.
+3
source to share
1 answer
http://docs.jquery.com/Plugins/Validation/validate
$("#selecttest").validate({
rules: {
field: {
required: true,
email: true
}
},
submitHandler: function(form) {
$('#div-loading').show();
$('#div-submit').hide();
form.submit();
}
});
+4
source to share