How to reset all data from a form if the user goes back to page?

Asked

Viewed 1,809 times

2

I have a form that after being submitted presents the result on a second page, like:

<form method="post" id="form" action="form.php">
<input name='nome' id='nome'>
<input type='submit' value='Enviar'>
</form>

And in the form.php something like:

$nome = $_POST['nome'];
echo "O nome é $nome";

In this question is answered how to reset the data when the request is processed on the same page, but I need the data that has been filled out to be completely reset if the user goes back to page by browser button or using keyboard. I tried to:

<script>
    $('#myForm')[0].reset();
</script>

But it didn’t work. What I need is that if the user goes back to the page, the field is no longer filled in. The form has several types of fields (select, input, checkbox, radio), and I need to reset all.

I read several questions on Soen, but due to the language barrier I was even in doubt about it is even possible.

Is it possible? How?

  • If it is post if you come back will ask you to resend the form. I solved this by sending only by ajax and when sending the form, save in the history the form page. You go back and it reloads the previous page. I’ll search and pass you the code.

  • No @Williancoqueiro, I think you’re confusing... when you return the browser not ask anything.... What the browser asks is when the user gives F5 in a form that has already been sent e.g. or when using a JS/Jquery to warn that coming back from the form page (not yet sent) will lose the data and such... In case what I need is to delete the entered data when the user back with browser button (or on the keyboard), after giving Submit...

  • Depends on the browser. More can use ajax Ué already resove then. Captures the fields by Javascript and reset before sending. By the right. '$('form'). Submit(Function()' $(this)[0].reset(); });'

  • I’m not using ajax, it wouldn’t work for me... but thank you for the strength...

  • You will need to use Javascript. And you cannot reset before submitting this form. You can use Javascript to change the history after sent on the next page. It works perfectly too.

  • Yes @Williancoqueiro, I think it would really work! Does an answer with example happen? Thanks!

  • Use like this: window.history.replaceState(msg, "Prefeitura Municipal ???????????", "index.php"); In your case it should be used after sending the request. Problem that this way, it will delete all history that you have traversed on the host and leave only this. For me decided to inhibit the user to return, in case he returns, always go to the home page. There’s a way to change the history of a page in the case may be the previous one, but I can’t remember why it didn’t work. But if this doesn’t solve your case, of a searched for: Change history with Javascript.

Show 2 more comments

2 answers

5

Another option is to use autocomplete for off, for example:

<input type="text" autocomplete="off" value="" name="nome_do_input">

Using autocomplete="on", pattern:


Using autocomplete="off":

  • So, +1, but look, in my case are a few hundred fields (I even gave a searched and I think it doesn’t work to select and textarea right...) and I already use jQuery... and it wouldn’t be too much code to include in all fields, instead of a small script...? In this case not worth using only the above script? I’m asking because I don’t even know... On the other hand I saw on https://www.w3schools.com/tags/att_input_autocomplete.asp that this tag is compatible with old browsers... so I would like to know if you think it is better if I use the function or change all tags?

  • 1

    I have these doubts, but the answer was good, I did not know the tag, and it will be useful for other things ctz... valeu ae, I will shippar +100 of rep! Hugs.

  • I think this answer is better than using a reset when loading the page, it seems safer. That said, nothing prevents you from using both, right?

  • How so safer @cav_dan?

  • 1

    Regarding to be compatible with more browsers and be more guaranteed to continue working in the long term. But, finally, my opinion.

  • Okay @Daniel, got it. Thanks.

Show 1 more comment

3


You’re on the right track, but when the browser comes back, it doesn’t reload the scripts, so you need a way to fire it.

Using the event onpageshow it should be possible to trigger such an event. I have not tested but it should work:

$(window).bind("pageshow", function() {
   $('#myForm')[0].reset();
})
  • I just tested and it worked.

  • Hi Edson, here did not work, I tested in Chrome and continue appearing the filled fields...

  • 1

    It cannot be inside $(window). load(), tried outside it?

Browser other questions tagged

You are not signed in. Login or sign up in order to post.