user3290885
Reputation: 9
Javascript arrays issue
I'm having a big issue with my website. I'm new to JavaScript, and I'm trying to use an array to store separate answers based on the answers entered into a text box. I'm using an online template I found here.
I'm changing this to suit what I need to do, though the answer is not working.
This works perfectly:
var answers = ["harry potter", "donald duck", "shrek", "supercoder"];
/*******************************/
//init() function
function init() {
var myButton = document.getElementById("btnSubmit");
myButton.onclick = registerName;
}
//assign init() function to onload event
onload = init;
/********************************************/
//registerName() function: it executes when user clicks the button
function registerName() {
//set up main vars: Username entered by user,
//a message string to communicate with the user,
//a reference to the paragraph used to display the message,
//and a boolean var (true/false) used as flag:
//if the registration is successful, this is set to true,
//if registration fails, this is set to false. It's initialized as false.
//Notice how you chain getElementById(), value, and toLowerCase
//to store the value entered by the user in lowercase
var newName = document.getElementById("txtName").value.toLowerCase();
var message = "";
var result = document.getElementById("result");
var success = false;
var m1 = false;
var m2 = false;
var m3 = false;
var m4 = false;
var m5 = false;
var m6 = false;
var m7 = false;
var m8 = false;
var m9 = false;
var m10 = false;
var s1 = false;
var s2 = false;
//If the user clicks the button but the inputbox is empty
//we alert the user and stop further program execution:
if(newName == "") {
alert("Please, enter a Username");
return false;
}
//we loop over each Username stored in the array
//to make sure the Username is not already in existence
for(var i = 0; i < answers.length; i++) {
//if we find a Username equal to the newly entered name,
//it means the Username already exists and we can't
//proceed with registration
if(answers[i] == newName) {
message = "Sorry, the Username " + answers[i] + " already exists. Try again";
result.innerHTML = message;
//set the success flag to false so the rest of the program knows
//that registration failed
success = false;
//stop further program execution
return false;
}
//else - if the Username entered by the user
//is not already stored in the application, register new user:
else {
message = "Great, you've successfully registered with us as " + newName;
result.innerHTML = message;
//set the success flag to true, so the program knows
//the new Username can be added
success = true;
}
}
//Now you're out of the loop
//if registration was successful (success flag is true),
//add new Username to the array with push()
if(success) {
answers.push(newName);
}
//display Usernames sorted alphabetically on a new line
result.innerHTML += "<br />" + answers.sort();
}
However, when I add the if else statements necessary to add in certain strings based on the input it ceases to work
//global array: it's outside any function
var answers = ["harry potter", "donald duck", "shrek", "supercoder"];
/*******************************/
//init() function
function init() {
var myButton = document.getElementById("btnSubmit");
myButton.onclick = registerName;
}
//assign init() function to onload event
onload = init;
/********************************************/
//registerName() function: it executes when user clicks the button
function registerName() {
//set up main vars: Username entered by user,
//a message string to communicate with the user,
//a reference to the paragraph used to display the message,
//and a boolean var (true/false) used as flag:
//if the registration is successful, this is set to true,
//if registration fails, this is set to false. It's initialized as false.
//Notice how you chain getElementById(), value, and toLowerCase
//to store the value entered by the user in lowercase
var newName = document.getElementById("txtName").value.toLowerCase();
var message = "";
var result = document.getElementById("result");
var success = false;
var m1 = false;
var m2 = false;
var m3 = false;
var m4 = false;
var m5 = false;
var m6 = false;
var m7 = false;
var m8 = false;
var m9 = false;
var m10 = false;
var s1 = false;
var s2 = false;
//If the user clicks the button but the inputbox is empty
//we alert the user and stop further program execution:
if(newName == "") {
alert("Please, enter a Username");
return false;
}
//we loop over each Username stored in the array
//to make sure the Username is not already in existence
for(var i = 0; i < answers.length; i++) {
//if we find a Username equal to the newly entered name,
//it means the Username already exists and we can't
//proceed with registration
if(answers[i] == newName) {
message = "Sorry, the Username " + answers[i] + " already exists. Try again";
result.innerHTML = message;
//set the success flag to false so the rest of the program knows
//that registration failed
success = false;
//stop further program execution
return false;
}
//else - if the Username entered by the user
//is not already stored in the application, register new user:
else {
message = "Great, you've successfully registered with us as " + newName;
result.innerHTML = message;
//set the success flag to true, so the program knows
//the new Username can be added
success = true;
}
}
//Now you're out of the loop
//if registration was successful (success flag is true),
//add new Username to the array with push()
if(newName == "a=0, b=20") {
answers.push("m1");
answers.push("s1");
} else if(newName == "a=20, b=20") {
answers.push("m2");
answers.push("s1);
}
else if (newName == "
a = 10, b = 0 ")
{
answers.push("
m3 ");
answers.push("
s1 ");
}
else if (newName == "
a = 10, b = 10 ")
{
answers.push("
m4 ");
answers.push("
s1 ");
}
else if (newName == "
a = 30, b = 50 ")
{
answers.push("
m5 ");
answers.push("
s1 ");
}
else if (newName == "
a = 0, b = 30 ")
{
answers.push("
m6 ");
answers.push("
s1 ");
}
else if (newName == "
a = 40, b = 30 ")
{
answers.push("
m7 ");
answers.push("
s1 ");
}
else if (newName == "
a = 40, b = 0 ")
{
answers.push("
m8 ");
answers.push("
s1);
} else if(newName == "a=10, b=20") {
answers.push("m9");
} else if(newName == "a=20, b=10") {
answers.push("m10");
answers.push("m1");
answers.push("s2");
answers.push("m2");
answers.push("m3");
answers.push("m4");
} else if(newName == "a=30, b=30") {
answers.push("m5");
answers.push("m6");
answers.push("m7");
answers.push("m8");
answers.push("m9");
answers.push("s2");
}
if(success) {
answers.push(newName);
}
//display Usernames sorted alphabetically on a new line
result.innerHTML += "<br />" + answers.sort();
}
I apologise I'm sure this is something blatantly obvious.
Upvotes: -1
Views: 52
Answers (1)
ElDoRado1239
Reputation: 4048
Your IF section at the bottom has syntax errors. The "a=20, b=20" part and "a=40, b=40" are incorrectly quoted.
else if (newName == "a=20, b=20")
{
answers.push("m2");
answers.push("s1); <---
}
And this
else if (newName == "a=40, b=0")
{
answers.push("m8");
answers.push("s1); <---
}
Also instead of
onload = init;
try using
<body onload="init();">
Upvotes: 1