How to prevent a form re-submission on clicking reload button in HTML

Question

when I enter data into the respective fields and click submit button the form is submitted and when i click on reload button it displays the following message "The page that you're looking for used information that you entered. Returning to that page might cause any action you took to be repeated. Do you want to continue?" how to prevent this form re-submission because on clicking the reload button I want to refresh the page. Here is HTML form.

<!DOCTYPE html>
<html>

<head>
  <title> Sample Page </title>
</head>

<body>
  <form id="login-form" method="post">
    <input type="text" id="user-name" name="Username" placeholder="USERNAME" maxlength="15" autocomplete="off"> <br> <br>
    <input type="password" id="pass-word" name="Password" placeholder="PASSWORD" maxlength="10" autocomplete="off"> <br> <br>
    <button id="login-button" name="login_button" type="submit"> Login </button>
  </form>
</body>

</html>

Possible duplicate of [Preventing form resubmission](https://stackoverflow.com/questions/3923904/preventing-form-resubmission) - I reckon that link will have everything you need. — James Jones, Aug 24 '18 at 05:18

score 0 · Accepted Answer · answered Aug 24 '18 at 05:18

I found a good website here that explains it, but basically you need to send the data to another page, using <form action="file.html">, then in that file, you have this element:

<meta http-equiv="refresh" content="0; URL='original-file.html'" />

This will redirect you to the original page, the one with the form on it, after 0 seconds, and the page can be refreshed without that issue.

How to prevent a form re-submission on clicking reload button in HTML

1 Answers1