CODEWITHSUNDEEP
javascriptsamsung-smart-tv
user3296544
user3296544

Reputation: 25

window.location.href still not working after cancelling form submission

I have an login form

<div id='login_form'>
        <table>
            <tr>
                <td>Username:</td>
                <td><input size=25 type='text' id='username'></td>  
            </tr>
            <tr>
                <td>Password:</td>
                <td><input size=25 type='password' id='password'></td>
            </tr>
            <tr>
                <td colspan='2' align='right'>
                      <input type='button' id='login' value='Login' onkeydown='normalobjKeyFunc(this)' onfocus='itemFocus(this)'                                                  onblur='itemBlur(this)'/>
                </td>
            </tr>
        </table>
</div>

then I have javaScript

var input_username = document.getElementById("username").value;
var input_password = document.getElementById("password").value;

if(input_username === "123" && input_password === "456"){
    alert("Correct username & password");
    window.location.href="../../result.html";
    return false;
}

But when I received the alert "Correct username & password", the page was not redirected to result.html. And I checked, "../../result.html" exists.

  1. I found some people said the submission should be cancelled, so I deleted form and changed the " type = "submit" " to " type = "button" "for Login button, but it was not working.
  2. And there is also another method, add "return false" after " window.location.href="../../result.html" ", but it was not working as well.

Any one has any idea???? Thanks in advance!

Upvotes: 0

Views: 564

Answers (2)

Datz Me
Datz Me

Reputation: 955

Put an onclick in your button to call your javascript function..

<input type='button' id='login' onclick="authenticate()" value='Login' onkeydown='normalobjKeyFunc(this)' onfocus='itemFocus(this)' onblur='itemBlur(this)'/>

Upvotes: 0

Seth
Seth

Reputation: 490

Username/password checking should be done on the backend (Java, PHP, Node, .NET)

Your form should be in a form tag though. The checking should be done in the onsubmit callback: 

<script>
    function authenticate(){
        var input_username = document.getElementById("username").value;
        var input_password = document.getElementById("password").value;

        if(input_username==="123"&&input_password==="456"){
            alert("Correct username & password");
            window.location.href = "../../result.html";
        }
        else {
            // Error
        }
        return false;
    }
</script>
<form onsubmit="authenticate()">
    <table>
        <tr>
            <td>Username:</td>
            <td><input size="25" type="text" id="username"></td>  
        </tr>
        <tr>
            <td>Password:</td>
            <td><input size="25" type="password" id="password"></td>
        </tr>
        <tr>
            <td colspan="2" style="text-align: right">
                <button onkeydown="normalobjKeyFunc(this)" onfocus="itemFocus(this)" onblur="itemBlur(this)">Login</button>
            </td>
        </tr>
    </table>
</form>

Upvotes: 1

Related Questions