clear input fields on page refresh (Microsoft Edge)

clear all form fields on page load
javascript clear form on refresh
clear form data on refresh jquery
clear input field after refresh
javascript clear input field on click
jquery clear form on refresh
reset form on page reload
refresh clear form

I'm just a beginner, but can someone help me out?

I have an HTML page with a couple of input fields, and I want the fields to be cleared when the page is refreshed.

My HTML looks like this:

<input type='text' id='input_field' value=''>

Then, toward the beginning of my script, there's this:

document.getElementById('input_field').value = '';

This works fine in Firefox; when the page is refreshed, the value is emptied and the field is cleared.

It does not work in Microsoft Edge; when the page is refreshed, the actual value is emptied, but the contents of the field remain.

I've also tried wrapping my input element(s) in a form element, and using JavaScript to reset the form, but the results are the same.

As you can see, I've kept the value attribute in the HTML, but only for purposes of demonstration and experimentation. Omitting it has no effect in either browser. However, if I leave the HTML attribute but omit the JavaScript statement, both browsers behave differently: in Edge, the contents of the field "catch up" to the actual value (i.e., the field clears), but only after the page is refreshed twice; and in Firefox, this fails to update the value at all, no matter how many times the page is refreshed.

Finally, if I edit the source in any way and then reload the page in Edge, it empties the actual value and also clears the field, but only on that initial reload. After that, the problem persists. This makes me wonder if it's a cache issue.

Any help or suggestions?


Add the attribute autocomplete="off" to the <input> tag.

<input autocomplete="off">

This may not work on all browsers. See this site for browser support chart: https://caniuse.com/#feat=input-autocomplete-onoff

If it's not working on Edge try the solution provided on this fiddle by fizzix.

Original post Chrome Browser Ignoring AutoComplete=Off.

Prevent IE 11 keeping input values after browser refresh, We have a simple form on a page. When user types into one of the input fields and refreshes through browser refresh button(or F5), it is� I have the same problem with a drop down menu. The option for reset is "true" and I put a default value. However, if I select an item in the box, I validate the form then I come back on the page, I still have the same item selected in the drop down menu. Can someone from Microsoft give a solution or correct the issue ?


First, thanks for the responses.

I had tried autocomplete='off' (sorry I forgot to mention that), but it didn't seem to work.

Just before checking here for replies, though, I decided to try one other experiment. I added a button to my page which, when clicked, would call a function containing the JavaScript .value = '' statement.

For whatever reason, that worked just fine; it emptied the value and cleared the field, which got me thinking that tying the "reset" to a specific HTML event might be the key. I tried a couple of things that didn't work, but finally I just replaced this:

document.getElementById('input_field').value = '';

. . . with this:

window.onload = function() {
  document.getElementById('input_field').value = '';
  }

. . . and that did it. Every time I refresh the page in either Firefox or Edge, the value is emptied and the field is cleared.

I'm not sure why that worked (like I said, I'm just getting started with this stuff), but there it is.

::-ms-clear, The ::-ms-clear CSS pseudo-element creates a clear button at the edge of an input type="text" text control that clears the current value. In the CSS of a website I'm currently working on we use the following CSS to hide the 'x' button that Internet Explorer 10 and 11 add to input fields for users to clear their contents: input::-ms-clear { display: none; } Viewing the same website in the first build of Microsoft Edge (formerly codenamed "Project Spartan") on Windows 10 Build


If the input is inside a form element <form id="example"> ... </form> , then you can do something like document.getElementById('example').reset(). You can call this inside window.onload.

HTMLFormElement.reset()

How to reset all form fields when reloading/refreshing page , The problem with this script is that if you select any of the check boxes and then click your browsers “refresh page” (not reset) button it will reset� Usually, when a refresh is made on an HTML page, the values for input fields are kept (unless you do Ctrl+F5). Is there a header or other type of setting than can change this behavior, without chaging anything on the form or input itself? I have a site where the input value is not kept after a page refresh in Production.


Clearing input box in Edge does not emit valueChanges using , Clearing an input field using the browser's native clear button should be EdgeHTML 18.17763 Windows 10 x64 October 2018 Update� Open your home page in the current tab. Alt + F4: Close the current window: F1. Open Help. F3. Find on page. F4. Select the URL in the address bar. Ctrl + F4. Close the current tab. F5. Reload the current page. Shift + F5. Reload the current page, ignoring cached content. F6. Switch focus to next pane. Shift + F6. Switch focus to previous pane. F7. Turn caret browsing on or off. F9


How to Clear Your Cache on Any Browser, Go to the three-dot menu () in Microsoft Edge and select Settings > Privacy Here you can get rid of browsing history, cookies, cached data, stored form data, saved and what data to dump (history, logins, forms/search, cookies, and cache). Applies to: Microsoft Edge Windows 10 Every time you enter payment info on a website, Microsoft Edge will ask you if you want to save the card. Once payment info like credit and debit card numbers are securely stored in the browser, you don’t have to remember and enter this info each time you buy something online.


Clearing the cache of the Microsoft Edge browser, The Microsoft Edge is a web browser designed to work with the new Windows 10 operating system (OS). And like any other browser, it keeps caches of web� We have a simple form on a page. When user types into one of the input fields and refreshes through browser refresh button (or F5), it is keeping the values that user typed in input fields. Ctrl + F5 or hitting Enter key clears the content in input fields. How to prevent this behavior or make it work the way other browsers like chrome work.