Css: Disabling autocomplete for inputs

To disable or turn off autocomplete/autofill for inputs using css, set the autocomplete attribute to 'off':

Eg:

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

This would be useful when a text input is one-off and unique. Like a CAPTCHA input, one-time use codes, or for when you have built your own auto-suggest/auto-complete feature and need to turn off the browser default.

Note: you can turn off autocomplete in your browser settings.

For more information, see here.

Disabling autocompletion for a form:

You can do this either for an entire form, or for specific input elements in a form:

Eg: for a form:

<form method="post" action="/form" autocomplete="off">

</form>

Eg2: for an input:

<form method="post" action="/form">
  <div>
    <label for="cc">Credit card:</label>
    <input type="text" id="cc" name="cc" autocomplete="off">
  </div>
</form>

Setting autocomplete="off" on fields has two effects:

1. It tells the browser not to save data inputted by the user for later autocompletion on similar forms, though heuristics for complying vary by browser.

2. It stops the browser from caching form data in the session history. When form data is cached in session history, the information filled in by the user is shown in the case where the user has submitted the form and clicked the Back button to go back to the original form page.

For more information, see here.

Mvc: Removing and enabling browser autocompletion:

In mvc you would implement this at the form or for a textbox:

Eg: set in mvc help helper object routeValues:

Html.BeginForm(
    action, controller, FormMethod.Post, new {autocomplete="off"})

Or:

Html.TextBoxFor(model => model.EmployerNumber, new {autocomplete="off"})