<p>When a user hits Refresh on their browser, it reloads the page but keeps the contents of form fields. While I can see this being a useful default, it can be annoying on some dynamic pages, leading to a broken user experience.</p>

<p>Is there a way, in HTTP headers or equivalents, to change this behaviour?</p>

[{'answer_id': 52221, 'author': 'Edward Wilde', 'author_id': 5182, 'author_profile': 'https://Stackoverflow.com/users/5182', 'pm_score': 2, 'selected': False, 'text': '<p>You could call the reset() method of the forms object from the body load event of your html document to clear the forms.</p>\n\n<p>h1. References</p>\n\n<ul>\n<li>MSDN reset Method - <a href="http://msdn.microsoft.com/en-us/library/ms536721(VS.85).aspx" rel="nofollow noreferrer">http://msdn.microsoft.com/en-us/library/ms536721(VS.85).aspx</a></li>\n<li><a href="http://developer.mozilla.org/en/DOM/form.reset" rel="nofollow noreferrer">Mozilla developer center form.reset</a></li>\n</ul>\n'}, {'answer_id': 52225, 'author': 'Rob Rolnick', 'author_id': 4798, 'author_profile': 'https://Stackoverflow.com/users/4798', 'pm_score': 0, 'selected': False, 'text': '<p>I wonder, if you set the page not to be cached through meta tags, will that fix the problem? <a href="http://lists.evolt.org/archive/Week-of-Mon-20030106/131984.html" rel="nofollow noreferrer">http://lists.evolt.org/archive/Week-of-Mon-20030106/131984.html</a> If it does, it\'ll have the benefit of working on browser\'s with Javascript disabled.</p>\n'}, {'answer_id': 52226, 'author': 'Joseph Bui', 'author_id': 3275, 'author_profile': 'https://Stackoverflow.com/users/3275', 'pm_score': 6, 'selected': True, 'text': '<pre><code>&lt;input autocomplete="off"&gt;\n</code></pre>\n'}, {'answer_id': 52229, 'author': 'Espo', 'author_id': 2257, 'author_profile': 'https://Stackoverflow.com/users/2257', 'pm_score': 3, 'selected': False, 'text': '<p>This should do the trick:</p>\n\n<pre><code>&lt;body onload="document.FormName.reset();"&gt;\n</code></pre>\n\n<p>Replace FormName with the name of your form and then all the fields will be reset when the user clicks refresh in his browser.</p>\n\n<p>Or if you only want to reset some fields, add this to the bottom of your page:</p>\n\n<pre><code>&lt;script type="text/javascript"&gt;\n    document.getElementById(\'field1\').value =\'\';\n    document.getElementById(\'field2\').value =\'\';\n    document.getElementById(\'field3\').value =\'\';\n&lt;/script&gt;\n</code></pre>\n\n<p>That will reset the fields every time a user enters the page, including refreshes</p>\n'}, {'answer_id': 86505, 'author': 'ThoriumBR', 'author_id': 16545, 'author_profile': 'https://Stackoverflow.com/users/16545', 'pm_score': 0, 'selected': False, 'text': '<p>The data on forms are not part of w3c specification. It\'s a browser feature to make your life easy. So, if you don\'t want to keep the data after reloads, you can set all form\'s values to null after loading it, as Espo said.\nEven if the page is not cached, it will display the data on the form, because the data aren\'t part of the page\'s html code.\nYou can try this too (don\'t know if it will work):</p>\n\n<pre><code>&lt;input type="text" name="foo" value=""&gt;\n</code></pre>\n'}, {'answer_id': 1812985, 'author': 'Fabien', 'author_id': 21132, 'author_profile': 'https://Stackoverflow.com/users/21132', 'pm_score': 2, 'selected': False, 'text': '<p>Add the autocomplete attribute set to "off" to the inputs you don\'t want to be refreshed.\nFor instance:</p>\n\n<pre><code>&lt;input type="text" name="pin" autocomplete="off" /&gt;\n</code></pre>\n\n<p>see\n<a href="http://www.w3.org/Submission/web-forms2/#the-autocomplete" rel="nofollow noreferrer">the W3C reference</a></p>\n\n<p>although not mentioned in the reference, it works also with checkboxes, at least on firefox.</p>\n'}]
['https://Stackoverflow.com/questions/52213', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/1000/']