Hi, in a "contact us" page named contact.htm that has some input textboxes, a submit button, and a reset button. When I fill out the fields and click Submit, it posts to an asp page that sends an email. What I want to do is to clear out the input fields after the .asp page is done, so if the user clicks the back button to go back to the fill-in page, the fields are all blank.

How would I do that?

Thanks,
Craig

Dani AI

Generated

Short answer: use the Post/Redirect/Get pattern on the server or, if you must let users hit Back to the form URL, clear the restored values when the page is shown again (use the pageshow event). Both approaches are valid; PRG prevents duplicate submissions and is simplest for most cases.

’s redirect idea is on the right track — after the ASP handler sends the email, redirect the browser so the form submission is not the last navigation entry. Redirecting to a dedicated "thank you" page (PRG) is preferable to redirecting straight back to the form because it prevents accidental resubmission and gives a clear confirmation. See Post/Redirect/Get for background: Post/Redirect/Get (PRG).

’s onLoad/reset trick can work, but it’s brittle: many browsers restore form values from the back/forward cache (bfcache) and may not fire the normal load event. A more reliable client-side approach is to handle the pageshow event and call the form API directly (use form.reset() rather than simulating a click). Example:

window.addEventListener('pageshow', function (event) {
  var nav = performance.getEntriesByType('navigation')[0];
  if (event.persisted || (nav && nav.type === 'back_forward')) {
    var f = document.getElementById('contactForm'); // match your form id
    if (f) f.reset();
  }
});

If you control server headers, adding conservative cache-control (no-store/no-cache) can help but may change UX and cause extra round trips — test across browsers. For the pageshow API and form.reset details see pageshow event and HTMLFormElement.reset(). Finally, consider whether clearing fields on Back is the best UX; sometimes presenting a confirmation page with an explicit "start a new message" link is kinder to users.

Recommended Answers

All 2 Replies

The 'response redirect' can help you.

<%
response.redirect('contact.html')
%>

When you submit the form and it will process in 'asp' file and then, redirect to the 'contact.html'. It make the browser refresh and all fields are clear.

Hi Zero13, thanks for your response.

I had actually, in the meantime, found a way to do this on another site. Simply put, in the "onLoad" attribute of the htm page's body tag, I called a JavaScript function that called the form's Reset button, like this:

var i;
for (i = 0; (i < document.forms.length); i++) {
document.forms.elements.click();
}

('Reset Button' is the name of the reset button)

Craig

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.