'Why Random variable is only returning 1 character [closed]

Hey guys im trying to generate a random password using upper and lowercase keys + numbers. the code seems to work but instead of returning 20 characters its instead returning only 1. The return seems random. The element should be replaced why the random password every time the button is clicked.

HTML

<button id = "button5" onclick = "password()">Generate password </button> 
<p4 id = "p4" > Your password will apear here </p4>
 

This is the Javascript

function password (length ) {
var ranpassword = "";
var chara = "abcdefghijklmnopqrstuvwxyz01234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ"


var charalength = chara.length // there is an outside variable defining charalength = ""; I could not include that here 
for (var i = 0; <length ; i++) {
ranpassword +=  chara.charAt(Math.floor(Math.random() *
chara.length));
return ranpassword;

}
document.getElementById("p4").innerHTML = "hello there " + ranpassword;
console.log(password(20));

}

whenver the button is clicked, one random letter is returned in console.log and i cant seem to understand why ? Can anyone tell me why? Any help would be great . Thanks :)



Solution 1:[1]

You did some mistake. Try this code,

function password (length) {
    let ranpassword = "",
        chara = "abcdefghijklmnopqrstuvwxyz01234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ",
        charalength = chara.length;

    for (var i = 0; i<length ; i++) {
        ranpassword +=  chara.charAt(Math.floor(Math.random() *
        chara.length));
    }

    document.getElementById("p4").innerHTML = "hello there " + ranpassword;
}
<button id = "button5" onclick="password(20)">Generate password </button> 
<p4 id = "p4" > Your password will apear here </p4>

Solution 2:[2]

Aside from your password function implementation partly wrong, you are not passing a length to password() function in your onclick handler.
You need to pass the length as well like password(20):

<button id = "button5" onclick = "password(20)">Generate password </button> 

Solution 3:[3]

as @Locke said, your for loop syntax is incorrect, as You are missing i in the comparison. Other than that, you code is flooded with typos. You didn't close the for loop, and you didn't need to return ranpassword. Now your code works, notice that the number I put as a parameter in the onclick in the HTML is the length your password will be. Also, instead of using .chatAt, I generate a random number and add it to ranpassword. For example: The for loop gets chara[4], so randpassword has chara's 5th letter.

function password(length) {
  var ranpassword = "";
  var chara = "abcdefghijklmnopqrstuvwxyz01234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ"


  var charalength = chara.length // there is an outside variable defining charalength = ""; I could not include that here 
  for (var i = 0; i < length; i++) {
    ranpassword += chara[(Math.floor(Math.random() *
      chara.length))];
  }
  document.getElementById("p4").innerHTML = "hello there " + ranpassword;
}
<button id = "button5" onclick = "password(4)">Generate password </button> 
<p4 id = "p4" > Your password will apear here </p4>
 

Solution 4:[4]

I have fixed the problem

function password(length) {
  var ranpassword = "";
  var chara = "abcdefghijklmnopqrstuvwxyz01234567890ABCDEFGHIJKLMNOPQRSTUVWXYZ";
  var charalength = chara.length;

  for (var i = 0; i < length; i++) {
    ranpassword += chara.charAt(Math.floor(Math.random() * chara.length));
  }
  return ranpassword;
}

console.log(password(5));

you were returning the password form the loop so it was returning a single character

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Jaydeep Mor
Solution 2 M.A Shahbazi
Solution 3 Rani Giterman
Solution 4 Kumar Kalyan