Icon search ui white

How to remove default browsers behavior on search input?

Last updated 01 August 2017

Introduction

When a user start typing to an HTML input, there might be a legacy auto-completion feature displayed. In this tutorial we’ll see how to disable this behavior.

Input markup

A classic the search html input definition looks like:

<input type="text" id="search" />

Updating input markup

There are four input attributes that we can define to cancel default browsers’ behavior:

  • autocomplete="off"
  • autocorrect="off"
  • autocapitalize="none"
  • spellcheck="false"

The updated input should look like this:

<input type="text"
       id="search"
       autocomplete="off"
       autocorrect="off"
       autocapitalize="none"
       spellcheck="false" />

More information on input properties

For more information check out the reference of each of those attributes:

What’s Next

Continue building your Algolia knowledge with these tutorials:

© Algolia - Privacy Policy