Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript jQuery Basics (2014) Creating a Password Confirmation Form Perform: Part 2

Posted by Axel Tavormina
Axel Tavormina
3,901 Points

Global variables

Hi ! I have a few issues with this exercice. Can you help me ?

  1. I don't understand what is wrong in my code, is the way i declare my global variables, not valid ?

  2. This is more a semantic question : In the video, the teacher is using a dollar sign in his variable, shouldn't the dollar sign be used in the variable to declare new objects that don't exist in the DOM yet ?

There is my code. 

$("form span").hide();
var password = $("#password").val();
var confirm = $("#confirm_password").val();

function passwordEvent(){ 
  if(password.length > 8) {
    $(this).next().hide();
  }
  else {
    $(this).next().show();
  }
}

function confirmPasswordEvent() {
  if (confirm === password){
     $(this).next().hide();
  }
  else {
    $(this).next().show();
  }
}

$("#password").focus(passwordEvent).keyup(passwordEvent);
$("#confirm_password").focus(confirmPasswordEvent).keyup(confirmPasswordEvent);

3 Answers

srikarvedantam
srikarvedantam
8,369 Points

You are not reading the values of DOM nodes dynamically or at run time (i.e. as user keys them), rather your global variables contain the values of "password" and "confirm_password" fields at the time of initial run of the script (which would be empty). The next() method does retrieves the element from the DOM as "this" refers to the DOM node on which the event was raised in this context.

Axel Tavormina
Axel Tavormina
3,901 Points

Ok, it confirms my thinking. Thanks

srikarvedantam
srikarvedantam
8,369 Points
srikarvedantam
srikarvedantam
8,369 Points

As mentioned in the exercise description, you just have to change line 51 as below and don't have to change any of the remaining code:

$confirmPassword.focus(confirmPasswordEvent).keyup(confirmPasswordEvent).keyup(enableSubmitEvent);
Axel Tavormina
Axel Tavormina
3,901 Points

Well I was still trying to make it work only on focus and keyup behaviors. But i think i understand what is the problem :

I defined the global variables values as input values. So when the code below is running , the next method will not get any element. Am i right ?

function passwordEvent(){ 
  if(password.length > 8) {
    $(this).next().hide();
  }
  else {
    $(this).next().show();
  }
}

So i need to change my variables only to store the inputs and use the "val" method inside my functions. 

$("form span").hide();
var password = $("#password");
var confirm = $("#confirm_password");

function passwordEvent(){ 
  if(password.val().length > 8) {
    $(this).next().hide();
  }
  else {
    $(this).next().show();
  }
}

function confirmPasswordEvent() {
  if (confirm.val() === password.val()){
     $(confirm).next().hide();
  }
  else {
    $(confirm).next().show();
  }
}

password.focus(passwordEvent).keyup(passwordEvent).focus(confirmPasswordEvent).keyup(confirmPasswordEvent);

confirm.focus(confirmPasswordEvent).keyup(confirmPasswordEvent);

Now $(this) is equal to the input and $(this).next() will get the next element, the span.

Tough, i'm still wondering when should we use the "$" sign in a variable, i tought it was when creating new objects ?

Nataly Diem
Nataly Diem
9,701 Points
Nataly Diem
Nataly Diem
9,701 Points

Hi there Axel! We use $ sign in a variable when we want to indicate that is a jQuery object, this way they are easily indentified.

Aurelian Spodarec
Aurelian Spodarec
10,801 Points
Aurelian Spodarec
Aurelian Spodarec
10,801 Points

but we don't have too, it's just a conventions programmers use