In the script below, I'm trying to capture the success event of the validation engine (all form element's validation criteria are satisfied) without submitting the form.
The idea is to disable the submit button until the validation is met, then I'd like to enable it. (The validationEngine examples I've seen appear to require the submit button to be enabled in order to submit the form, then its validated after the submit)
However, I can't get the "valid" method in my validate() function to fire. Any ideas what I'm doing wrong?
$(document).ready(function() {
/* disable the submit button until required form elements are enabled */
$('#btnEcommidEdit').attr('class','button disabled');
$('#btnEcommidEdit').attr("disabled","disabled");
/* initiate validation */
$("#form1").validationEngine(
{
inlineValidation: true
});
/* check form elements to enable submit button */
$('#email2,#confirm1,#confirm2').change(function() {
validate();
});
});
function validate(){
var valid = $("#form1").validationEngine();
if (valid)
$("#btnEcommidEdit").attr('disabled','');
else
$("#btnEcommidEdit").attr("disabled","disabled");
}
function validate(){
alert("validate");
var valid = $("#form1").validationEngine();
alert('Validation Engine returned : ' + valid);
if (valid == true) {
$("#btnEcommidEdit").prop("disabled",false);
$("#form1").submit();
} else {
$("#btnEcommidEdit").prop("disabled",true);
return false;
}