john Smith
john Smith

Reputation: 17916

Jquery Validate -> fadeIn textField if specific-textFields are valid?

I got stuck on a very simple Question,

I have a form in that order:

The whole form is validated with .validate() and it´s working awesome and shows up nice error messages etc..

The one thing I couldn't achieve is : I want the Username-textfield to only show up if email, pw and pw2`s values are valid

I have the username input inner a div class="reguser" style="display:none;"

I tried the .valid() method like :

if ($('#passwort').valid() && $('#passwort2').valid() && $('#email').valid()) {
    $('.reguser').show();
};

that doesnt work at all, all fields asked if .valid() are initially highlighted with the error message now and if they are getting valid by putting valid value in, .reguser doesn't show up

also tried to catch the class valid, but i guess i need to do this on an event like onfocusout or so

if ($('#passwort').hasClass('.valid') && $('#passwort2').hasClass('.valid') && $('#email').hasClass('.valid')) {
    $('.reguser').show();
};

Has anyone a hint for me ? I´m searching the Internet for hours and hours and not making progress

Upvotes: 0

Views: 120

Answers (1)

Ortiga
Ortiga

Reputation: 8824

Since all required fields are needed to show the username field, you can check if the whole form is valid:

$('#formId :input').on('blur', function(){
    if($('#formId').valid())
    {
        $('.reguser').show();
    }
});

You can change blur to the event you want.

Upvotes: 1

Related Questions