i've just start a coding boot camp and for our third assignment we had to code a Random Password Generator with a few user preferences. i wrote my code and everything work apart from one bit. When the user only chooses to have numerical values an error is given where my selection pool of characters tells me that "pSelection.charAt is not a function at generatePWD".
It makes no sense to me at all considering that function works perfectly in every other situation. I've tried making a separate array for the specific (else if) Statement that is failing. I've tried swapping variable names in case of a clash of "Char".
If someone could have a look and tell me what I've done wrong i'd appreciate the help because i thought i understood what was going on but apparently not..
Here's the JavaScript - Below is the HTML
// Add event listener to the generate button
document.getElementById("generate").addEventListener("click", function(){
// Setting up the possible Characters
var lowercaseAlphabetChar = ("abcdefghijklmnopqrstuvwxyz");
var uppercaseAlphabetChar = ("ABCDEFGHIJKLMNOPQRSTUVWXYZ");
var numericChar = (1234567890);
var specialChar = ("!@#$%^&*()?~/|:'><");
var password = "";
var pSelection = "";
// User Prompts
var length = prompt("How long is your Password? Choose between 8 and 128 Characters");
// Making sure User Chooses between 8 and 128 Characters
if (length < 8 || length > 128){
alert("Length has to be Between 8 and 128. Please Try Again")
return
}
var wantsLower = confirm("Do you want Lowercase Characters?")
var wantsUpper = confirm("Do you want Uppercase Characters?")
var wantsNumbers = confirm("Do you want Numerical Characters?")
var wantsSpecial = confirm("Do you want Special Characters?")
//Verification Points System - I allocate a point when an option is confirmed. if no points are allocated, user has not selected anything
var verify = 0;
if (wantsLower == true || wantsUpper == true || wantsNumbers == true || wantsSpecial == true) {
verify += 1;
}
if (verify == 0) {
alert("You have not selected a character Type, Please Try again.")
return
}
// Script will exit if not verified, if verified we Proceed to Grouping Password to User Needs.
function generatePWD() {
for (var i = 0; i <= length; i++) {
password = password + pSelection.charAt(Math.floor(Math.random() * Math.floor(pSelection.length - 1)));
}
}
// IF STATEMENTS for User PreferenceLowerCase
if (wantsLower && !wantsUpper && !wantsNumbers && !wantsSpecial) {
pSelection = lowercaseAlphabetChar;
generatePWD();
}
// LowerCase and UpperCase
else if (wantsLower && wantsUpper && !wantsNumbers && !wantsSpecial) {
pSelection = lowercaseAlphabetChar + uppercaseAlphabetChar;
generatePWD();
}
//LowerCase and UpperCase and Numbers
else if (wantsLower && wantsUpper && wantsNumbers && !wantsSpecial) {
pSelection = lowercaseAlphabetChar + uppercaseAlphabetChar + numericChar;
generatePWD();
}
// Everything
else if (wantsLower && wantsUpper && wantsNumbers && wantsSpecial) {
pSelection = lowercaseAlphabetChar + uppercaseAlphabetChar + numericChar + specialChar;
generatePWD();
}
//Lowercase and Numbers
else if (wantsLower && !wantsUpper && wantsNumbers && !wantsSpecial) {
pSelection = lowercaseAlphabetChar + numericChar;
generatePWD();
}
//Lowercase and Numbers and Special
else if (wantsLower && !wantsUpper && wantsNumbers && wantsSpecial) {
pSelection = lowercaseAlphabetChar + numericChar + specialChar;
generatePWD();
}
// Lowercase and Special
else if (wantsLower && !wantsUpper && !wantsNumbers && wantsSpecial) {
pSelection = lowercaseAlphabetChar + specialChar;
generatePWD();
}
// Uppercase
else if (!wantsLower && wantsUpper && !wantsNumbers && !wantsSpecial) {
pSelection = uppercaseAlphabetChar;
generatePWD();
}
// UpperCase and Numbers
else if (!wantsLower && wantsUpper && wantsNumbers && !wantsSpecial) {
pSelection = uppercaseAlphabetChar + numericChar;
generatePWD();
}
// Uppercase and Numbers and Special
else if (!wantsLower && wantsUpper && wantsNumbers && wantsSpecial) {
pSelection = uppercaseAlphabetChar + numericChar + specialChar;
generatePWD();
}
// Uppercase and Special
else if (!wantsLower && wantsUpper && !wantsNumbers && wantsSpecial) {
pSelection = uppercaseAlphabetChar + specialChar;
generatePWD();
}
// Numbers
else if (!wantsLower && !wantsUpper && wantsNumbers && !wantsSpecial) {
pSelection = numericChar;
generatePWD();
}
// Numbers and Special
else if (!wantsLower && !wantsUpper && wantsNumbers && wantsSpecial) {
pSelection = numericChar + specialChar;
generatePWD();
}
// Special
else if (!wantsLower && !wantsUpper && !wantsNumbers && wantsSpecial) {
pSelection = specialChar;
generatePWD();
}
document.getElementById("password").innerHTML = password;
console.log(password);
});
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Password Generator</title>
<link rel="stylesheet" href="assets/style.css" />
</head>
<body>
<div class="wrapper">
<header>
<h1>Password Generator</h1>
</header>
<div class="card">
<div class="card-header">
<h2>Generate a Password</h2>
</div>
<div class="card-body">
<textarea
readonly
id="password"
placeholder="Your Secure Password"
aria-label="Generated Password"
></textarea>
</div>
<div class="card-footer">
<button id="generate" class="btn">Generate Password</button>
</div>
</div>
</div>
<script src="assets/script.js"></script>
</body>
</html>
numericChar
needs to be a string i.e. "1234567890"
- as it is, you've got it initialised with a number.
If you change the declaration of the variable to
var numericChar = "1234567890";
Then it should work :)