I have a form which is being validated by jQuery Validation. I am also using recaptcha from Google as of http://ift.tt/1hWkvmp
Now wham I am doing is the submit button stays disabled attribute true initially until user actually fills the recaptcha properly.
This part works.
When form is just loaded, user cannot just press the submit button without entering data. In such case, since the button has attribute disabled true, nothing happens aka no disabled message is fired from the jquery validation. I want to fire up the validate plugin in such case. How to do it?
(function() {
$('#newsletter-form').validate({
rules: {
'newsletter_type[name]': {
required: true
},
'newsletter_type[email]': {
required: true,
email: true
}
},
messages: {
'newsletter_type[name]': {
required: '<span class="glyphicon glyphicon-remove "></span> Please enter your name.'
},
'newsletter_type[email]': {
required: '<span class="glyphicon glyphicon-remove "></span> Please enter a valid email address.',
email: '<span class="glyphicon glyphicon-remove "></span> Please enter a valid email address.'
}
}
});
if ($('.hasError').length) {
$('html, body').animate({
scrollTop: $('.hasError').offset().top - 130
}, 500, null);
}
}).call(this);
And,
<script src="http://ift.tt/1zBKsBY" async defer></script>
<div class="g-recaptcha" data-callback="recaptchaCallback" id="captcha_container"></div>
<script type='text/javascript'>
var verifyCallback = function (response) {
$('#newsletter_type_submit').attr('disabled', false);
//console.log(response);
};
var captchaContainer = null;
var loadCaptcha = function () {
captchaContainer = grecaptcha.render('captcha_container', {
'sitekey': 'xxxxxxx',
'theme': 'light',
'callback': verifyCallback
});
$('#newsletter_type_submit').attr('disabled', true);
};
</script>
The submit button has id newsletter_type_submit
Aucun commentaire:
Enregistrer un commentaire