HTML and JavaScript not working correcty

Question

I just started learning javascript and I have been on HTML for some time now. I know I have successfully coded a right JavaScript code for my log in form.

Here is my JavaScript code:

<script>
function login(){
    var username=document.getElementById('usrnm');
    var password=document.getElementById('pass');
    if(username=="abc"){
        if(password=="123"){
            window.location.href="mypage.html"
        }
        else{
            window.location.href="error.html"
        }
    else{
        window.location.href="error.html"
    }
}
</script>

And here is my HTML form:

<form name="input" method="get">
<b>Username:</b>
<br>
<input id="usrnm" type="text" name="usrnm">
<br>
<br>
<b>Password:</b>
<br>
<input id="pass" type="password" name="pswrd">
<br>
<br>
<center>
<input id="login" type="image" src="login.png" value="login" onclick="login()">

When I click on the Log in button. It only reloads the same page it is in but as you can see, I intended to call "mypage.html". I'mm just starting to learn JavaScript so if there are any obvious reasons why my code wont work, be easy. Thanks =). I know my JavaScript works because when I tried inserting onclick="login()" to the line <form name="input" method="get"> the code directs me to "error.html" when I type on the Username field or Password field.

Add .value to username and password. Like this if(username.value == "abc") — NoLifeKing
– NoLifeKing, Commented Aug 8, 2013 at 12:06
You have a typo in your if condition, you are missing } of main if — Dhaval Marthak
– Dhaval Marthak, Commented Aug 8, 2013 at 12:06
you can shorten code if(username=="abc" && password=="123" ){ success page } else { go error page } — rab
– rab, Commented Aug 8, 2013 at 12:07
refer this question stackoverflow.com/questions/11810874/… — Sara
– Sara, Commented Aug 8, 2013 at 12:24

imulsion · Accepted Answer · 2013-08-08 12:07:07Z

4

You are not getting the element values, just the elements. Add .value to the end of your document.getElementById(id) method calls.

answered Aug 8, 2013 at 12:07

imulsion

9,07620 gold badges59 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Artyom Neustroev · Accepted Answer · 2013-08-08 12:07:41Z

4

You JS does not work as intended. You are selecting elements, but not their values. Try changing to the following:

<script>
function login(){
    var username=document.getElementById('usrnm').value;
    var password=document.getElementById('pass').value;
    if(username=="abc"){
        if(password=="123"){
            window.location.href="mypage.html"
        }
        else{
            window.location.href="error.html"
        }
    }
    else{
        window.location.href="error.html"
    }
}
</script>

answered Aug 8, 2013 at 12:07

Artyom Neustroev

8,7355 gold badges36 silver badges59 bronze badges

6 Comments

imulsion Over a year ago

that is exactly my answer

Artyom Neustroev Over a year ago

@DKM,@imulsion we posted almost simultaneously, sorry. Copy-pasted OP's code, didn't notice, now edited.

Dhaval Marthak Over a year ago

it Happens :) no worries ;)

Carlo Solomon Fernandez Over a year ago

@ArtyomNeustroev Neustroev, Still does not work. If you want I can post my disorganized, 657 line code. Cx

Artyom Neustroev Over a year ago

@CarloSolomonFernandez try to debug your login function to see what exaclty happens.

|

Naveen Kumar Alone · Accepted Answer · 2013-08-08 12:07:57Z

0

Get the usrnm id, pass id values as

var username=document.getElementById('usrnm').value;
var password=document.getElementById('pass').value;

OR

Otherwise pass if condition as

if(username.value == "abc"){
    if(password.value == "123"){
      .....
    }
}

answered Aug 8, 2013 at 12:07

Naveen Kumar Alone

7,6985 gold badges40 silver badges59 bronze badges

Comments

Surya Prakash Tumma · Accepted Answer · 2013-08-08 12:10:26Z

0

change the code

var username=document.getElementById('usrnm').value;

var password=document.getElementById('pass').value;

answered Aug 8, 2013 at 12:10

Surya Prakash Tumma

2,2234 gold badges29 silver badges50 bronze badges

Collectives™ on Stack Overflow

HTML and JavaScript not working correcty

4 Answers 4

Comments

6 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

6 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related