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

Posted by hee chung
hee chung
3,530 Points

.charAt() function error (not a function)

I am trying to building a project on basis of jQuery password project with adding more password validation such as including numbers, capital letters, and special characters. However, I am stuck at the beginning with using .charAt() function error saying "it is not a function" . Please help me to troubleshoot this. Thank you in advance.

 //Problem: Hints are shown even when form is valid
//Solution: Hide and show them at appropriate times
var $password = $("#password");
var $chPassword = '';
var $confirmPassword = $("#confirm_password");
var $username = $("#usename");

//Hide hints
$("form span").hide();

function isPasswordValid() {
 // if ($password.val().length > 8)
 // {
    for (var i = 0; i < $password.val().length; i += 1 )
    {
    $chPassword = $password.charAt(i);
    console.log($chPassword);

    }


  //}

  return $password.val().length > 8; // check the length of password.
}

function isUsernameFilled () {
    if ($username.val().length > 0)  // check the username was entered
    {
    return true;
    }
    else {
    return false;
    }
}
function arePasswordsMatching() {
  return $password.val() === $confirmPassword.val();
}

function canSubmit() {  // if there are valid matching password and entered username, passes true. 
  return isPasswordValid() && arePasswordsMatching() && isUsernameFilled;
}

function passwordEvent(){
    //Find out if password is valid  
    if(isPasswordValid()) {
      //Hide hint if valid
      $password.next().hide();  // next element (span) from the id = password and hide 
    } else {
      //else show hint
      $password.next().show();  // next element (span) from the id = password and show
    }
}

function confirmPasswordEvent() {
  //Find out if password and confirmation match
  if(arePasswordsMatching()) {
    //Hide hint if match
    $confirmPassword.next().hide(); // next element (span) from the id = confirmpassword and hide
  } else {
    //else show hint 
    $confirmPassword.next().show();  // next element (span) from the id = confirmpassword and show
  }
}

function enableSubmitEvent() {
  $("#submit").prop("disabled", !canSubmit());  //if can submit it true enable submit otherwise disable it
}

//When event happens on password input
$password.focus(passwordEvent).keyup(passwordEvent).keyup(confirmPasswordEvent).keyup(enableSubmitEvent); 
// when user places first curser in the password field it starts passwordEvent, when start typing passwordEvent, confirmPasswordEvent, enableSubmitEven start
//When event happens on confirmation input
$confirmPassword.focus(confirmPasswordEvent).keyup(confirmPasswordEvent).keyup(enableSubmitEvent);
// when user places first curser in the confirm password field it starts confirmPasswordEvent, when start typing confirmPasswordEvent and enableSubmitEven start
enableSubmitEvent();

1 Answer

Chyno Deluxe
Chyno Deluxe
16,936 Points

You current code is checking for the value of the input with the id of password rather than the value that is entered in the input.

try this.

for (var i = 0; i < $password.val().length; i += 1) {
  $chPassword = $password.val().charAt(i);
  console.log($chPassword);
}

I hope this helps.

hee chung
hee chung
3,530 Points

thank you that works..