JS window.location not working

Question

My window.location does not redirect the page to the required location. The same code with window.open works. The else statement also executes when the user name and password are incorrect. When the correct username and password is entered, it just refreshes the same page.

    <div class="login" style="position:relative;top:200px;">

    <form name="login" method="post">
    <p align="middle">Please login to continue </p><p align="middle"><input type="text" name="login" placeholder="Username"></p>

    <p align="middle"><input type="password" name="pwd" placeholder="Password"></p>
    <p class="submit" align="middle"><input type="submit" onclick ="return check(this.form)" value="Login" name="commit"></p>

    </form>

    <script language="javascript">
        function check(form) { 
            if(form.login.value == "admin" && form.pwd.value == "sysadmin") {
                window.location('alumni.html');
            }
            else {
                alert("Ten thousand thundering typhoons! What is the blasted password?");
            }
        }
    </script>




    <!--<script type='text/javascript' src='alumna.json'></script> -->
    </div>

score 3 · Answer 1 · edited May 23 '17 at 11:51

You can also try with

 window.location = 'http://www.yoururl.com/alumni.html';

or directly

 window.location = 'alumni.html';

There is a good question about redirect in javascript here: How do I redirect with Javascript?

[EDIT #1]

Although I think that is not the main problem. I believe you can not validate the way you are doing it. In the form there is an attribute called action as explained in http://www.w3schools.com/tags/att_form_action.asp

Then in the page you load, you validate the parameters and decide if its right or not, where you redirect to one page if its right, or to another if it's wrong.

Or you can also load the page and if validation is right, stay in the page and if it's wrong redirect to the login page.

That's one way to do it, probably there is another one better.

[EDIT #2]

What I would personally do is to process the form in a PHP page, it's much easier and simpler. Could be like:

in the HTML:

 <div class="login" style="position:relative;top:200px;">

    <form name="login" action="myPhpPage.php" method="post">
    <p align="middle">Please login to continue </p>
    <p align="middle"><input type="text" name="login" placeholder="Username"></p>

    <p align="middle"><input type="password" name="pwd" placeholder="Password"></p>
    <p class="submit" align="middle">
    <input type="submit" onclick ="" value="Login" name="commit"></p>

    </form>

    <!--<script type='text/javascript' src='alumna.json'></script> -->
</div>

In the PHP page:

$name = $_POST['login']; // it's $_post because you are sending the form with method = post
$pass =  $_POST['pwd'];  

if($name == "admin" &&  $pass == "sysadmin"){
    //go to one page or stay here
} else{
    // redirect to another page
}

omarjmh · Answer 2 · 2016-04-26T15:18:07.200

1

window.location is a read only property:

The Window.location read-only property returns a Location object with information about the current location of the document.

MDN on window.location

try this: window.location.replace("http://stackoverflow.com");

edited Apr 26 '16 at 15:18

answered Apr 26 '16 at 15:13

omarjmh

13,632
6
34
42

I tried ^ with the replace and the link. Didn't work. – lazycamper Apr 26 '16 at 15:20
Yeah, I did. Any other ideas? – lazycamper Apr 26 '16 at 15:35
It's the same as in the question, except that the window.location line is different. – lazycamper Apr 26 '16 at 15:40
so no http//www ? do that too – omarjmh Apr 26 '16 at 15:40

Kenmei · Answer 3 · 2018-07-20T07:11:27.643

Here's a working code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title> Login Redirection Test</title>
<script>
    function validateForm() {
    var un = document.forms["login"]["user"].value;
    var pw = document.forms["login"]["pwd"].value;
    if (un == "admin" && pw=="sysadmin") {
        window.location.assign="https://stackoverflow.com";
        return false;
        }else {
                alert("Ten thousand thundering typhoons! What is the blasted password?");
            }
    }
</script>
</head>

<body>
    <div class="login" style="position:relative;top:200px;">

    <form name="login" onsubmit="return validateForm()"  method="post">
    <p align="middle">Please login to continue </p><p align="middle"><input type="text" name="user" placeholder="Username"></p>

    <p align="middle"><input type="password" name="pwd" placeholder="Password"></p>
    <p class="submit" align="middle"><input type="submit" onclick ="return check(this.form)" value="Login" name="commit"></p>

    </form>


    <!--<script type='text/javascript' src='alumna.json'></script> -->
    </div>
</body>
</html>

score 0 · Answer 4 · answered Apr 28 '16 at 01:52

0

Window.location is not a function, it is a property that is just read. However,

    window.location.assign

might work better.

answered Apr 28 '16 at 01:52

Zinger

413
2
5
16

JS window.location not working

4 Answers4