autoComplete.js - Pure Vanilla Javascript libraryUpdated on 2018-11-19

autoComplete.js :sparkles:

Build Status
Open Source Love

autoComplete.js Design

Simple autocomplete pure vanilla Javascript library. Demo

autoComplete.js is a simple pure vanilla Javascript library that's built for speed, high versatility and seamless integration with wide range of projects & systems.


  • Simple & Easy to use
  • Pure Vanilla Javascript
  • Zero Dependencies
  • Lightweight
  • Lightning Fast
  • Versatile
  • Customizable

autoComplete.js Code Example

Get Started


  1. Install Dependencies $ npm i
  2. Development live server $ npm start
  3. Build Production Package $ npm run build

How to use:

  1. Instantiate autoComplete engine
  2. Configure it as shown below
  3. You're ready to go ```js // The app instance creator

new autoComplete({
dataSrc: grocery, // Array data source
placeHolder: "Try me ...", // Place Holder text
maxNum: 10, // Max number of results
highlight: true, // Highlight matching results
dataAttribute: {
tag: "set", // Data attribute tag
value: "value" // Data attribute value
onSelection: value => { // Action script onClick event
document.querySelector(".selection").innerHTML =;

Release History

  • v1.0.0
    • Add customized data tags for generated results
    • Highlight matching results
    • Set maximum number for shown results
    • Add placeholder text to the input field
    • Placeholder keeps the last selection value



  • Navigate results list with keyboard
  • Add different types of data source (Objects, Multidimensional Arrays, etc...)
  • Multi-Search


  • Show number of results inside text field
  • Change input field Color
  • Change input field Icon


Tarek Raafat -

Distributed under the Apache 2.0 license. See Apache 2.0 for more information.


Contributions are always more than welcome!

If you have any ideas, just open an issue and tell me what you think.

  • Please fork the repository and make changes as you'd like. Pull requests are warmly welcome.

If you'd like to contribute:

  1. Fork it (
  2. Create your feature branch (git checkout -b feature/fooBar)
  3. Commit your changes (git commit -am 'Add some fooBar')
  4. Push to the branch (git push origin feature/fooBar)
  5. Create a new Pull Request


Apache 2.0 © Tarek Raafat