A simple, lightweight JQuery plugin to easily convert any unordered list or select element into an autocomplete textbox.
JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
README.md
jquery.autocomplete.js
jquery.autocomplete.min.js

README.md

jquery.autocomplete

A simple, lightweight JQuery plugin to easily convert any unordered list or select element into an autocomplete textbox. Styling on the resulting autocomplete input is intentionally bare as it is designed to incorperate the styling of your site.

Usage

###Basic Usage

$(function() {
   $('select').autocomplete();
});

Options

Options are available to enable you to specify your own classes on the different elements in the final output.

$(function() {
  $('.macsen-autocomplete').autocomplete({
    'containerclass' : 'your-container-class',
    'searchclass' : 'your-input-class',
    'resultsclass' : 'your-ul-class',
    'listitemclass': 'your-li-class',
    'selectedclass': 'your-selected-class'});
});

The html rendered for this will be:

<div class="your-container-class">
    <input class="your-input-class" for="selectid">
    <ul class="your-ul-class" for="selectid" >
        <li value="option value 1" class="your-li-class">Option text 1</li>
        <li value="option value 2" class="your-li-class">Option text 2</li>
        <li value="option value 3" class="your-li-class">Option text 3</li>
        <li value="option value 4" class="your-li-class">Option text 4</li>
        <li value="option value 5" class="your-li-class">Option text 5</li>
        <li value="option value 6" class="your-li-class">Option text 6</li>
        <li value="option value 7" class="your-li-class">Option text 7</li>
    </ul>
</div>    

View a basic demo here: http://jsbin.com/afamum/12/edit