CODEWITHSUNDEEP
jqueryvalidation
Emma
Emma

Reputation: 1

Disable submit button until form is valid

I have a form that is validated with the bassistance validate plugin. It all works very well (great plugin by the way) but I would like to disable the submit button until the form is valid.

According to the author Jörn Zaefferer (read comment here) I have to track the validity of all fields and then enable the button.

So I presume that I first have to find my all fields with a class name of 'required' and then check if they also have a class of 'valid', and then finally enable the button... but I am really struggling to do this (I have already spent 3.5 hours, it is driving me crazy!)

I tried to bind my input fields to listen for the 'valid' class using the timer technique that was proposed here, and came up with the following:

function doneTyping () {

var requiredFields = $('input').hasClass('required');

$(requiredFields).each(function(){
    if ($(this).hasClass('valid')){
        console.log('form is valid, enable button here');
    } else {
        console.log('form is not valid yet');
    }
});

}

However my code doesn't work... Can someone please tell me if I am heading in the right direction?

Upvotes: 0

Views: 2162

Answers (2)

osaka
osaka

Reputation: 328

You can check if form is valid using the below idea according to ur plugin

alert (($("#Form1").validationEngine('validate')));

This will give you a true or false value, and based on that you can show or hide the button.

Initially hide the button using:

$(document).ready(function() 
{
  $("#ButtonSubmit).hide();
}

Upvotes: 0

user1432124
user1432124

Reputation: 

function doneTyping () {

var requiredFields = $('input.required');

    if ($("input.required:not(:valid)").length){
        console.log('form is not valid, disable button here');
    } else {
        console.log('form is  valid ');
    }

}

Upvotes: 2

Related Questions