Make page to tell browser not to cache/preserve input values

Question

Most browsers cache form input values. So when the user refreshes a page, the inputs have the same values.

Here's my problem. When a user clicks Save, the server validates POSTed data (e.g. checked products), and if not valid, sends it back to the browser. However, as stated above, even if the server clears selection for some values, they may still be selected because of the browser cache!

My data has invisible (until parent item selected) checkboxes, so the user may be even not aware that some previous value is still selected, until clicking Save again and gets an error message - even though the user thinks it's not. Which is irritating.

This can be resolved by doing Ctrl + F5, but it's not even a solution. Is there an automatic/programmatic way to tell browser not to cache form input data on some form/page?

Is there a way to answer this question with reference to drop down ` — Martin, Mar 31 '16 at 22:57
I want to achieve the opposite - preserve each page's input values on back button(click back twice-get inputs accordingly). There are various examples around using lot of JS code, (which dont really work IMHO) but - is there a simpler way? I tried autocomplete="on" on both form and input fields-doesn't work. Browser is Chrome. — Dmitry z, Jul 02 '20 at 19:47

score 204 · Accepted Answer · answered Apr 23 '10 at 14:38

204

Are you explicitly setting the values as blank? For example:

<input type="text" name="textfield" value="">

That should stop browsers putting data in where it shouldn't. Alternatively, you can add the autocomplete attribute to the form tag:

<form autocomplete="off" ...></form>

answered Apr 23 '10 at 14:38

DisgruntledGoat

62,693
62
192
281

1

I talk about checkboxes so I can't set value to "". And, does autocomplete off means not to store form input values "when user presses F5", not only "for dropdown autocompletion list"? – queen3 Apr 23 '10 at 17:20
2

According to https://developer.mozilla.org/en/How_to_Turn_Off_Form_Autocompletion, autcompletion=off affects "Session history caching", at least in Gecko. I will test if it works for what I need. – queen3 Apr 23 '10 at 17:24
1

@queen3: Yes, checkboxes are a problem since there is no way to explicitly say "not checked". If you're still having problems, you could try `checked="false"`, it may work in some browsers. Another alternative is to use Javascript/jQuery to explicitly untick all checkboxes on page load. – DisgruntledGoat Apr 28 '10 at 10:28
1

@queen3, you mean "autocomplete=off" not "autocompletion=off" – Matt Baker Jul 11 '12 at 23:20
2

All of the answers and suggestions didnt work for me. Using chrome and develeoping .net – hakan Jun 08 '14 at 10:45
@piedpiper Try ModelState.Clear() in your controller action. If you are using return View(...or return PartialView(... then it will return the old values. This is by design for MVC. – thenninger May 02 '17 at 20:19
...adding autocomplete="off" as an input field argument did the trick for me – 6opko Apr 11 '21 at 13:54

score 48 · Answer 2 · edited Jun 02 '20 at 17:54

48

From a Stack Overflow reference

It did not work with value="" if the browser already saves the value so you should add.

For an input tag there's the attribute autocomplete you can set:

<input type="text" autocomplete="off" />

You can use autocomplete for a form too.

edited Jun 02 '20 at 17:54

Peter Mortensen

28,342
21
95
123

answered Jun 19 '13 at 08:36

shareef

7,886
12
53
80

9

In Chrome, it appears `autocomplete="off"` has no effect when used on individual form-elements - even with `value` attribute explicitly set blank, and while sending a `Cache-Control: Must-Revalidate` header, this had no effect. I had to apply the `autocomplete="off"` attribute to the `
` element itself to suppress this behavior in Chrome.
– mindplay.dk Jul 18 '13 at 19:24
i did autocomplete="off" on form but it didnt work for me – Kingsley Simon May 09 '16 at 03:08
i need more info @KingsleySimon like browser , and you may have some settings on your browser that prevent the correct behavior – shareef May 09 '16 at 11:04
1

it seems that browser's behavior has changed: https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion – david Aug 24 '16 at 20:48
and be noted the html valid form . and for example its not aform inside another etc – shareef Aug 25 '16 at 08:37

score 10 · Answer 3 · edited Jun 02 '20 at 16:58

10

Another approach would be to reset the form using JavaScript right after the form in the HTML:

<form id="myForm">
  <input type="text" value="" name="myTextInput" />
</form>

<script type="text/javascript">
  document.getElementById("myForm").reset();
</script>

edited Jun 02 '20 at 16:58

Peter Mortensen

28,342
21
95
123

answered Dec 08 '11 at 17:31

pmko

4,901
3
21
24

score 8 · Answer 4 · edited Jun 02 '20 at 17:55

8

Basically, there are two ways to clear the cache:

<form autocomplete="off"></form>

or

$('#Textfiledid').attr('autocomplete', 'off');

edited Jun 02 '20 at 17:55

Peter Mortensen

28,342
21
95
123

answered Jul 25 '15 at 04:27

Anand Dwivedi

1,429
12
21

score 7 · Answer 5 · edited Jun 02 '20 at 17:56

7

This worked for me in newer browsers:

autocomplete="new-password"

edited Jun 02 '20 at 17:56

Peter Mortensen

28,342
21
95
123

answered Jul 24 '17 at 14:34

erikrunia

2,291
1
13
21

Make page to tell browser not to cache/preserve input values

5 Answers5

Linked

Related