Thursday 26 March 2015

How do you disable browser Autocomplete on web form field / input tag?

How do you disable browser Autocomplete on web form field / input tag?

Question: What is Browser Autocomplete?
When we start typing in text-box, Sometimes browser start giving you suggestion. This is known as Browser Autocomplete.
For Example:
We type "mo", Its start giving you suggestion like
"Morning Forest"
"Morph"
"Mountains"
"Mom"
"Money"
..
..
etc


Question: Why browser gives us suggestion (Autocomplete)?
Technically, every text box have some name: like
<input name="username" type="text" value="" />
Above text box name is "username"
When same text-box OR text-box having same name, get multiple data by one OR different user, It start giving you suggestion which is previously entered.

In other word
Its it gives you previous keywords which was used to entered for same textbox.



Question: How to disable the autocomplete for one field?
just add the autocomplete="off" in the text box.
For Example:
<input autocomplete="off" name="username" type="text" value="" />



Question: How to disable the autocomplete for all fields in Form?
just add the autocomplete="off" in the form.
For Example:
<form action="/" autocomplete="off">
...
....
...
</form>

When you add, autocomplete=off in form tag, you need need not to add individually for each filed, it will do automatically disabled for each field in the form tag.


Question: Does all browser support autocomplete=off?
Yes, All browser in all OS.




Question: When we add autocomplete=off in text box OR form, Will it disable autocomplete for all users on different browser?
Yes, It will disable the autocomplete for all user whether they are using same OR different browser.


Question: Can we add autocomplete=off with javascript?
Yes, We can try see below example:
HTML Part
<input class="noAutoComplete" type="text" />
Javascript Part
$(function() {
    $('.noAutoComplete').attr('autocomplete', 'off');
});
After adding above JS script, It will stop autocomplete for those text-filed which have class "noAutoComplete".