Don't know how to fix Popup message opening when not needed

Question

I've been trying to make a website login with HTML and Javascript and it works fine except for one problem. The first login information logs in, but the else popup message shows! How do I fix this?

function Login(form) 
{
    username = new Array("alex364981");
    password = new Array("Codylewis");
    page = "user2" + ".html";

    if (form.username.value == username[0] && form.password.value == password[0]
            || form.username.value == username[1] && form.password.value == password[1]
            || form.username.value == username[2] && form.password.value == password[2]
            || form.username.value == username[3] && form.password.value == password[3]
            || form.username.value == username[4] && form.password.value == password[4]
            || form.username.value == username[5] && form.password.value == password[5]
            || form.username.value == username[6] && form.password.value == password[6]
            || form.username.value == username[7] && form.password.value == password[7]
            || form.username.value == username[8] && form.password.value == password[8]
            || form.username.value == username[9] && form.password.value == password[9])
    {
        self.location.href = page;
    }

    username = new Array("test");
    password = new Array("this");
    page = "user1" + ".html";

    if (form.username.value == username[0] && form.password.value == password[0]
            || form.username.value == username[1] && form.password.value == password[1]
            || form.username.value == username[2] && form.password.value == password[2]
            || form.username.value == username[3] && form.password.value == password[3]
            || form.username.value == username[4] && form.password.value == password[4]
            || form.username.value == username[5] && form.password.value == password[5]
            || form.username.value == username[6] && form.password.value == password[6]
            || form.username.value == username[7] && form.password.value == password[7]
            || form.username.value == username[8] && form.password.value == password[8]
            || form.username.value == username[9] && form.password.value == password[9])
    {
        self.location.href = page;
    }
    else
    {
        alert("Either the Username or Password is Wrong.\nPlease try again.");
        form.username.focus();
    }
    return true;
}

could you mock up something in a [jsfiddle](http://jsfiddle.com) ? — Eric Goncalves, Dec 17 '12 at 17:02
`'Multiple exclamation marks', he went on, shaking his head, 'are a sure sign of a diseased mind.'` ([Terry Pratchett](http://en.wikipedia.org/wiki/Terry_Pratchett)) This is not meant to be insulting, just a little reminder that it is sufficient to use only one of them. This improves readability a lot. — Matthias, Dec 17 '12 at 17:02
I hope this is just for testing... you are aware this is NOT how you implement authentication. http://stackoverflow.com/questions/549/the-definitive-guide-to-forms-based-website-authentication — MikeSmithDev, Dec 17 '12 at 17:06
you can mock up a isolated example using the link I sent you so we can better understand / assist you with your problem. — Eric Goncalves, Dec 17 '12 at 17:06
for two users i want the users when logged in to go to different pages — user1877134, Dec 17 '12 at 17:13

score 0 · Accepted Answer · answered Dec 17 '12 at 17:12

The else block is only applicable to the second if check

username = new Array("test");
password = new Array("this");
page = "user1" + ".html";

if (form.username.value == username[0] && form.password.value == password[0] || form.username.value == username[1] && form.password.value == password[1] || form.username.value == username[2] && form.password.value == password[2] || form.username.value == username[3] && form.password.value == password[3] || form.username.value == username[4] && form.password.value == password[4] || form.username.value == username[5] && form.password.value == password[5] || form.username.value == username[6] && form.password.value == password[6] || form.username.value == username[7] && form.password.value == password[7] || form.username.value == username[8] && form.password.value == password[8] || form.username.value == username[9] && form.password.value == password[9])

{
    self.location.href = page;
}
else {
    alert("Either the Username or Password is Wrong.\nPlease try again.");
    form.username.focus();
}

You should be getting the successful login from the first if block.

You should use a flag to check if any of the logins succeeded and use the flag to display the error message.

Try this:

function Login(form) 
{
    flag = false;

    username = new Array("alex364981");
    password = new Array("Codylewis");
    page = "user2" + ".html";

    if (form.username.value == username[0] && form.password.value == password[0] || form.username.value == username[1] && form.password.value == password[1] || form.username.value == username[2] && form.password.value == password[2] ||  form.username.value == username[3] && form.password.value == password[3] || form.username.value == username[4] && form.password.value == password[4] || form.username.value == username[5] && form.password.value == password[5] || form.username.value == username[6] && form.password.value == password[6] || form.username.value == username[7] && form.password.value == password[7] || form.username.value == username[8] && form.password.value == password[8] || form.username.value == username[9] && form.password.value == password[9])

    {
        self.location.href = page;
        flag = true;
    }

    username = new Array("test");
    password = new Array("this");
    page = "user1" + ".html";

    if (form.username.value == username[0] && form.password.value == password[0] || form.username.value == username[1] && form.password.value == password[1] || form.username.value == username[2] && form.password.value == password[2] || form.username.value == username[3] && form.password.value == password[3] || form.username.value == username[4] && form.password.value == password[4] || form.username.value == username[5] && form.password.value == password[5] || form.username.value == username[6] && form.password.value == password[6] || form.username.value == username[7] && form.password.value == password[7] || form.username.value == username[8] && form.password.value == password[8] || form.username.value == username[9] && form.password.value == password[9])

    {
        self.location.href = page;
        flag = true;
    }

    if(!flag) {
        alert("Either the Username or Password is Wrong.\nPlease try again.");
        form.username.focus();
    }
    return true;
}

do i just add that to the first? – user1877134 Dec 17 '12 at 17:14 — user1877134, Dec 17 '12 at 17:14

SnareChops · Answer 2 · 2012-12-17T17:41:41.160

0

Try this. Looping through your array should clean up the code and readability. This will also make it easier to expand later.

function Login(form) 
{
    username = new Array("alex364981");
    password = new Array("Codylewis");
    page = "user2.html";

    var numOfUsers=10;
    for(var i=0;i<numOfUsers;i++)
    {
        if (form.username.value == username[i] && form.password.value == password[i])
        {
            self.location.href = page;
            return true;
        }
    }
    //All possibilities exhausted, Show error.
    alert("Either the Username or Password is wrong.\nPlease try again.");
    return false;
}

Hope this helps.

Also beware that users can view the source code for your html and get the username and password directly from the function. It's best to hide it in a php script or a database.

edited Dec 17 '12 at 17:41

answered Dec 17 '12 at 17:16

SnareChops

12,124
8
61
88

The else should go outside the loop. – ATOzTOA Dec 17 '12 at 17:29
@ATOzTOA potatoe potatado (Updated nevertheless) – SnareChops Dec 17 '12 at 17:42
How can people view the javascript? Its in a seperate file – user1877134 Dec 22 '12 at 16:08
@user1877134 Even if the javascript is in a different file you still have to link to it with the ` – SnareChops Dec 22 '12 at 20:04

Don't know how to fix Popup message opening when not needed

2 Answers2