Home > other >  Make an HTML button redirect me to another page
Make an HTML button redirect me to another page

Time:10-18

How do I make this button redirect me to another page?

<button type="submit" onclick="register()">Create new account</button>

Here is the function that the button is using:

function register() {
    let object = {
        "username": document.getElementById("username").value,
        "password": document.getElementById("password").value
    };

    let json = JSON.stringify(object);
    let xhr = new XMLHttpRequest();
    xhr.open("POST", '/api/user/new', false)
    xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
    xhr.send(json);

    if (xhr.status != 200) {
        alert("Something went wrong!");
    } else if (xhr.status == 200){
        alert("Success!");
    }
}

I want the button to redirect me to 'index.html' file

CodePudding user response:

Try wrapping button in form tag like this:

<form action="index.html">
    <button type="submit" onclick="register()">Create new account</button>
</form>

CodePudding user response:

It seems this has already been answered in quite extensive way: How do I redirect to another webpage?

to sum up: there is a number of ways to achieve that:

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')

If You want to go there after successful call of the function - put one of these instead of "alert("Success!");"

CodePudding user response:

<form action="/action_page.php" method="get">
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Last name:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <button type="submit">Submit</button>
  <button type="submit" formaction="/action_page2.php">Submit to another page</button>
</form>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>

Example A form with two submit buttons. The first submit button submits the form data to "action_page.php", and the second submits to "action_page2.php":

Definition and Usage The formaction attribute specifies where to send the form-data when a form is submitted. This attribute overrides the form's action attribute.

The formaction attribute is only used for buttons with type="submit".

Please refer this link: https://www.w3schools.com/tags/att_button_formaction.asp

  • Related