14 Javascript Autocomplete Libraries

In this article, I will introduce you to some of the most commonly used autocomplete libraries of the year 2021. Let’s go to find out together!

What Is Autocomplete?

This is a nice feature commonly used with forms in HTML. It helps you to make suggestions idea through the words that the user enters in the input box. In my opinion, it is quite useful in reduce the time as well as increase the user experience when using your website.

Awesomplete

Awesomplete is an open source library with a size of only about 2Kb (after compression) that helps you create autocomplete feature for website without any additional libraries. Before using, you need have to download 2 files, awesomplete.css and awesomplete.js. Then you just need to call class awesomplete and add data-list="ID of your list" for input cell is possible can be used. What I like is that its extensibility is also very easy through the property settings calculated for the HTML object as data-minchars: after how many words the user input will be displayed hint display, data-maxitems: the number of elements that the hint list can contain... Also it can suggestions by dropdown, get suggestions through Ajax... this part you can see on the demo page!

Link Awesomplete

Horsey

Horsey is an open source library that helps you create autocomplete features quickly and easily. as easy set up for website. You can use it for many different types of websites with many features useful features such as loading suggestions via Ajax, using keyword suggestions, limiting the number of suggestions for users, use dropdown to display suggestions… It works on most popular browsers today and for With IE, it’s from IE7+ and up.

Link Horsey

autoComplete.js

autoComplete.js is a pure javascript built library that helps you with feature creation autocomplete easily and optimize site performance. With highly customizable features, without any additional libraries, compact size, simple, easy to use, then I think this is a good library for your website. In addition, it also has some other useful features when you set it up features such as search mode, highlighting search keywords, determining how many results to display…

Link autoComplete.js

typeahead.js

typeahead.js is a javascript autocomplete feature builder inspired by Search function on Twitter social network. It has two main libraries, Bloodhound used to handle calculations compute the outputs to the user, and the UI component renders suggestions and interacts with the DOM. Introduction This time I will only focus on the interface, but if you want to learn more, you can check it out on Github’s page it’s okay typeahead.js. This library has many useful features such as displaying suggestions by each group, add default suggestions, easily refine the interface for suggestions…

Link typeahead.js Ví Dụ UI typeahead.js

Algolia Places

Algolia Places is a Javascript library that helps us create a feature that displays recommendations for users when searching for a certain location quickly and easily. It will automatically give suggestions about address, city, country… every time you type in the input box. What I like most about it is that we have You can set up location suggestions through the real-time map provided by the library to help users easily visualize content and have a more intuitive view. However, it also has a limitation that if you want to use it, you need Sign up to receive API access to library information. And with the free version they We will get 100,000 requests/month. If you want to use more, the price will be 0.4$ for 1000 requests.

Link Algolia Places

autoComplete

autoComplete is a compact and efficient Javascript library that helps you create autocomplete easily for website. With a size of only about 5.4kb and written in pure javascript, you can be applied to many different types of websites. It provides some useful features such as number limit Minimum word count, set delay for suggestions, change search method and settings style for hints via the renderItem... attribute You can see specific examples here Library main page for more reference!

Link autoComplete

Accessible Autocomplete

Accessible Autocomplete is a Javascript library that generates an autocomplete feature with the title increase user experience, support on many different devices, browsers and easy to set up for website. You just need the file accessible-autocomplete.min.js and then set up the feature for the website through the declaration of 3 basic properties, element: object in HTML page, id: id of lable and source: suggested information source. In addition, it is also have some more features like limit the number of suggestions, add placeholder for input box, auto select suggestion I mean... these attributes all have examples on their example page!

Link Accessible Autocomplete

Example Accessible Autocomplete

AutoJS

AutoJS is an open source library built with javascript that makes it possible to generate words suggestions during user input through a standard dictionary developed based on research linguistic research and methods. Currently, as far as I can see, it is only used for English with size Standard size is about 17kb (contains more than 10,000 words). In addition, it also has two other versions: microphone (contains about 1500 words) and maximum (contains about 32,000 words). You just need to download the file and initialize it with the code javascript is ready to use!

Link AutoJS

email-autocomplete

email-autocomplete is an open source library built with jquery that helps you build functionality suggest email domains to users. For example, when you enter hello@gm, the program will automatically The suggested animation is hello@gmail.com. It's convenient, right. You also have easy setup Style the text color for the suggested word in the input box through the .eac-sugg class. Also if you want to see Commonly used email domains can be found on its github page.

Link email-autocomplete

Ajax AutoComplete for jQuery

Ajax AutoComplete for jQuery is an open source library built with jquery that makes it easy to Create autocomplete feature for your website. It only uses the additional library Jquery with size size after compressed is only about 2.7kb. It also has a number of features that can help you tailor it for your site as suggestion suggestions via Ajax, limit the height of the suggestions, display position show suggestions, the number of suggested results you want to display…

Link Ajax AutoComplete for jQuery

Flexselect

Flexselect is an open source library built with jquery that helps you display suggestions for users, when they enter something in the input box, the suggestions will be displayed through the dropdown. For the normal way of selecting via the select tag, it has a limitation that when the user wants to select otherwise they have to search the information from the beginning in the list. That would be very inconvenient as well as lose a lot of time for the client so this library appears to help you with the above problem. For ease of understanding As well as know how to set up the website, you can see its demo page.

Link Flexselect

Other Autocomplete Libraries

Link Vue-autosuggest

Link react-input-enhancements

Link Angucomplete

Summary:

Through this, I hope the article will provide you with useful autocomplete libraries for development, web design and if you have any questions just send an email I will respond as soon as possible. I hope you Please continue to support the site so that I can write more good articles. Have a nice day!

Buy me a Coffee

Where you can find programming resources for web development such as HTML, CSS, Javascript, Bootstrap, Programming Resources, Web Design.