How can I refresh a form page after the form submits to _blank?

Question

I have an HTML form which targets _blank. I would like the page that form is on to reload after submitting.

So here's some sample markup:

<form method="POST" action="result.php" target="_blank">
    <label for="name">Name:</label>
    <input type="text" name="name" />

    <label for="email">Email:</label>
    <input type="email" name="email" />

    <input type="submit" value="submit" />
</form>

So when you submit this form it will POST to result.php in a new window or tab. This leaves the form page as is. I want the form page to reload, or at least reset all fields.

I've tried <form onsubmit="location.reload()"... as well as onsubmit="window.location.reload()" but nothing changed.

Any suggestions?

(please no jquery)

Answer 1

Not sure why window.location.reload() doesn't work. I think it should. However, this does seem to work:

onsubmit="setTimeout(function () { window.location.reload(); }, 10)"

Answer 2

There are two ways to do this, one that you may not want to hear about.

FIRST:

In the form init tag, if you set action="" then the form will submit to the same page (to itself).

<form action="" method="post">

This allows you to add server-side code to the top of the page, like this (using PHP, for example):

<?php
    If (empty($_POST)===false) {
        //server side scripting to handle the submitted form
    }else{
?>
    //HTML to create/show the page with form for user input
<?php
    //Close the if statement
    }
?>

SECOND:

Use AJAX (javascript or jQuery) to "submit" the form, and then -- in the AJAX function's callback -- carry on with whatever changes you want to make to the page, including redirecting to a new page.

Answer 3

The accepted answer did not produce the desired results for me.

Accepted answer:
onsubmit="setTimeout(function () { window.location.reload(); }, 10)"

Changing the accepted answer from onsubmit to onclick did fix my issue;

Worked for me:
onclick="setTimeout(function () { window.location.reload(); }, 3)"

There may be undesirable results, or this may not be preferred but it performs as desired for me.

Answer 4

It should work if a callback is passed to the onsubmit event attribute. For example,

(Traditional anonymous function)

onsubmit="function() {location.reload()}"

or

(Arrow function)

onsubmit="() => location.reload()"

Answer 5

location.refresh(true);

will help