Home > database >  Doesn't redirect when pressing ok in the alert. Why?
Doesn't redirect when pressing ok in the alert. Why?

Time:12-04

(Edited)If i copy the code from the answer given bellow from a different user it works perfectly in a new black html file.Something must be going on with my code not allowing the redirection to happend.I will include some of the html/css of the program

<header class='header'>

<title>Εγγραφή</title>

<link rel="stylesheet" type="text/css" href="mystyle.css" >
<center><img src="logo.png" alt="LOGO" height=100></center>
</header>

<div >
            <p style="font-family: system-ui; font-size: 15pt;">           
            <label for="onoma" style="font-size:15pt;">Διεύθυνση*:</label>&nbsp;
            <input id="address" type="text" id="address" name="address" value="" >&nbsp;&nbsp;

<p style="font-family: system-ui; font-size: 15pt;">    
            <div >
            <label for="mera" style="font-size:15pt;">Συνθηματικό πρόσβασης*:</label>&nbsp;
            <input id="password" type="password" id="mera" name="mera" value="" >&nbsp;&nbsp;
            <label for="minas" style="font-size:15pt;">Κωδικός πρόσβασης*:</label>&nbsp;
            <input id="password2" type="password" id="minas" name="minas" value="" >&nbsp;&nbsp;

div align="center">   
    <input type="reset" value="Reset">
    <input type="submit" id="btn" value="submit">
    </div>   
    <br><br>&nbsp;<br><br>&nbsp; 
    <script type="text/javascript" src="java.js"></script>

CSS

body {
    margin: 0;
    font-family: system-ui   
   
}
.logocolor {
    background-color:cornflowerblue;
}

.background{
    background-color:wheat;
}
header {
    background-color: rgb(0, 132, 255);
}
.text{
    text-align:left;
    text-indent: 150px;
}
label {
 font-family: system-ui 
}
.change{
    display: flex;
}

Also the current java

function CheckPassword(address, password, password2) {
    if (password === "" || password2 === "" || address === "") {
      alert("Καποιο/Καποια κενά δεν συμπληρώθηκαν σωστά ή ειναι κενά")
    } else {
      alert('message');
      window.location = 'newpage.html';
    }
  }
  
  function ClickMe() {
    CheckPassword(
      document.getElementById('address').value,
      document.getElementById('password').value,
      document.getElementById('password2').value
    );
  }
  
  document.getElementById('btn').addEventListener("click", function() {ClickMe()});

CodePudding user response:

It's working as per the snippet and the codesandbox here. You just need to be sure that;

  • Each of IDs that's going to be read exists as an HTML element,
  • The HTML page desired to be redirected exists and correctly named besides matching the exact path within the expression.

You can also successfully redirect via methods below;

  • window.location.href = 'newPage.html'
  • window.location.replace('newPage.html');

You can take a look at here for their difference.

function CheckPassword(address, password, password2) {
  if (password === "" || password2 === "" || address === "") {
    alert("Καποιο/Καποια κενά δεν συμπληρώθηκαν σωστά ή ειναι κενά")
  } else {
    alert('message');
    window.location = 'https://stackoverflow.com';
  }
}

function ClickMe() {
  CheckPassword(
    document.getElementById('address').value,
    document.getElementById('password').value,
    document.getElementById('password2').value
  );
}

document.getElementById('btn').addEventListener("click", function() {ClickMe()});
<input type="text" id="address" />
<input type="text" id="password" />
<input type="text" id="password2" />

<button id="btn">Button</button>

CodePudding user response:

The current web URL is located in window.location.href, not window.location. Here's an example navigation snippet:

document.getElementById("navigate").addEventListener("click", (e) => {
  window.location.href = "https://example.com/";
})
<button type="button" id="navigate">Navigate</button>

function CheckPassword(address, password, password2) {
  if ((password == "") || (password2 == "") || (address == "")) {
    alert("Καποιο/Καποια κενά δεν συμπληρώθηκαν σωστά ή ειναι κενά")
  } else {
    alert('message');
    window.location.href = 'new page.html';
  }
}

function ClickMe() {
  CheckPassword(document.getElementById('password2').value, document.getElementById('password').value, document.getElementById('address').value)
}

document.getElementById('btn').addEventListener("click", function() {
  ClickMe()
});

So your corrected code would use window.location.href instead of window.loaction.

  • Related