How to disable Autocorrect, spellcheck and autocomplete HTML5 Tip

Hi Guys,

There are time when you would like to disable AutoCorrection, Spell checking, Auto Completion for your form fields. This is true when a field takes in values like names, addresses, phone numbers etc

Even though mobile browsers and desktop browsers offers these as features to help users to make less mistakes with their typing and all but as stated there are times when they MAY be less desirable.

Browsers such as Chrome, Firefox, Opera or even Internet Explorer helps developers out with disable these features, at form level and or at field level.

Oh and we can also add fourth attribute to equation called AutoCapitalize

Let me show you with an example but let me tell you about the property names first

1. autocomplete
   values: on|off
2. autocorrect
   values: on|off
3. autocapitalize
   values: on|off
   
4. spellcheck
   values: true|false

The Markup

So the above will give us much to test on

you can also use these properties at  form level as shown below

Here is a quick demo

(Open this page in mobile browser and see if you can hit the nail with the demo provided)

http://jaspreetchahal.org/examples/html5/disable_form_features.html

I hope that this post was helpful. Just keep these properties in mind, at least if you know they exist you can use them at will and when most desired. You can prevent auto complete, auto correction, spell checking and auto capitalization just with ease.

Cheers.