jQuery Plugin For Creating Smart Autocompletion For Input Fields

Autocomplete jQuery plugin to create smart autocompletion and for displaying a suggestion list that enables the users to complete text in sequence while typing.

autocomplete input, html autocomplete from list, autocomplete input html, autocomplete attribute, autocomplete search

How to make use of it:

1. Load the required jQuery library and jQuery caret plugin within the HTML doc.

<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/jquery.caret-1.5.2.min.js"></script>

2. Download and load the jQuery Autocomplete.js script after the jQuery library.

<script src="autocomplete.js"></script>

3. Active the plugin on desired input area.


4. Modify or override the predefined recommendations.

  values: [

5. More configuration choices and callbacks with default values.

  collection: 'languages',
  separator: 'and',
  offset: {
    y: 36,
    x: 6
  handler: function () {},
  select: function () {
    return true;

6. The default HTML template for the suggestion checklist.

var _$display = $('<div class="autocomplete" style="z-index:9999999;display:none;position:relative; background-color: white;border: 1px solid #999;top:' + settings.offset.y + 'px;left:' + settings.offset.x + 'px; max-height: 40%; max-width:300px; width:auto; overflow-y: auto;overflow-x: none;"></div>');

Smart jQuery Autocomplete Plugin For Input Fields, smart autocompletion Github

See Demo And Download

Official Website(lcavadas): Click Here

This superior jQuery/javascript plugin is developed by lcavadas. For extra Advanced Usages, please go to the official website.

Leave a Comment