Easy Select Plugin

Demo here

Getting Started

Download the plugin from here.
Add a reference to jquery.easy-select.js and easy-select.css in your page. You can use the minified version instead by using jquery.easy-select.min.js and easy-select.min.css.
In order to use the plugin on text input element:
Markup: <input type="text" class="my-input" />
JavaScript: $('.my-input').easySelect();

Easy select has a few options:

Type: Array of objects Default: `[]` Array of items for the select box.

Type: String Default: `id` The name of the attribute that represents the item id.

Type: String Default: `text` The name of the attribute that represents the item text.

Type: Function Default: `null` A callback function that triggered every time a new item gets selected.

Easy select has also a few useful methods. In order to use them you need to access the API object:

$('.my-input').data('easySelect');

In order to get the selectd text you can read the value of your text input. getValue() method returns the value (or id) of the selected item.

$('.my-input').data('easySelect').getValue();

setItems() method lets you change the items list during runtime. This method is useful when you want to load data asynchronously.

$.get('url/to/data').done(function(items) {
    $('.my-input').data('easySelect').setItems(items);
});

destroy() method destroys the plugin by removing unnecessary elements and unbinding events.

$('.my-input').data('easySelect').destroy();

Fork it!
Create your feature branch: git checkout -b my-new-feature
Make your changes on the src folder, never on the dist folder
You can use grunt build and grunt preview commands in order to see your changes on the demo
Commit your changes: git commit -m 'Add some feature'
Push to the branch: git push origin my-new-feature
Submit a pull request