CODEWITHSUNDEEP
jquery
Latox
Latox

Reputation: 4705

jquery global var? how to do this?

Okay I have this above my validation:

var error = true;

Below this all of my validation takes place, for example:

/* FIRST NAME VALIDATION */
$("#firstname").change(function () {
    var firstname = $('#firstname').val();
    if (firstname == ""){
        $('#firstname').css({"border-color":"#3399ff"});
        $('#firstname-err').html("You must enter your first name.").removeClass("success_msg").addClass("error_msg");
        error = true;
    }else{
        $('#firstname-err').html("Thank you " + firstname + ", thats perfect!").removeClass("error_msg").addClass("success_msg");;
        $('#firstname').css({"border-color":"#1f6d21"});
        error = false;
    }
});

and I have this at the bottom of my validation

if(error == true)
{
    $('#btn-join').css({"opacity":"0.4"});
    $('#btn-join').attr("disabled", true);
}
else
{
    $('#btn-join').css({"opacity":"1"});
    $('#btn-join').attr("disabled", false);
}

Basically, I want it to run through each one and if they are all false, the submit button becomes enabled.

How do I go about doing this?

I'm fairly new to jQuery so sorry if I didn't make sense.

Upvotes: 0

Views: 261

Answers (3)

Surreal Dreams
Surreal Dreams

Reputation: 26380

All you have to do to get a global var in JavaScript or jQuery is to declare it at the broadest scope, then refer to it again (without the var keyword). I usually declare these variables before my jQuery ready() function. That should let you access the variable throughout the document in your scripts. Just make sure that you don't re-declare the variable with var or you'll get a localized version of it.

One note on your logic - I am assuming that you're validating more than one field. Since any of these fields may set the error variable to true, you're going to want to avoid setting it to false on individual validation tests. Here's what I'd do:

  • Declare the error variable outside the jQuery code.
  • When your validation function starts, initialize error to false.
  • Run each field's validation test. If the test fails, mark it visually for the user and set error to true. If the test passes, don't change the value of error.
  • Repeat for each field's test.
  • When all tests are finished, test the value of error to see if all the tests passed or if you have an error. Act accordingly.

I hope that helps.

Upvotes: 1

Thomas Clayson
Thomas Clayson

Reputation: 29935

I'm not really sure what your problem is here, or what you're asking.

As far as the scope of the variable is concerned, as long as you declare it before the block of code then it should be in scope in your jquery code.

I can forsee some problems with your method though.

I would initially set var error = false;. You don't have any errors before you've started.

Then you don't need to set error = false; anywhere in the code. If you do this then you're negating any time you've changed it to true before in the script.

Lets say you validate first name and then second name afterwards.

First name has an error so you set error = true.

Second name doesn't have an error, so you set error = false. This will then confuse you because you've forgotten that there was an error with first name.

Lastly an even better way to do it would be to set var error = '';. Then as you go through do: error += 'You need to fill in your first name.<br />'; or similar. That way when you get to the end instead of seeing if error === true you can see if error != ''. If that evaluates to true then you can output the error which will be contained in the error variable which will be an amalgamation of all the errors you've encountered throughout the running of the script.

Hope this helps.

Upvotes: 0

BNL
BNL

Reputation: 7133

Bind the change event to the form, then all of your form fields will trigger it. In that function validate all of the data.

That way, whenever any value in the form is changed, the button will be updated with the correct state.

Upvotes: 0

Related Questions