Just wanted to know if there already is plugin for this, otherwise I am going to code myself. Following is my exact requirement.
Say I have a dropdown list like this -
<select id="values" name="country">
<option value="1">Hello world</option>
<option value="2">Hello there</option>
<option value="3">Hello again</option>
<option value="4">Andorra</option>
<option value="5">Argentina</option>
<option value="6">Armenia</option>
<option value="7">Aruba</option>
<option value="8">Australia</option>
<option value="9">Austria</option>
...
</select>
And there is an input field for the user to filter the dropdown contents. So it looks like this in the beginning -
Use Cases (Requirements)
Obvious case of single word entry -> User enters "Hello"
Result should have only options containing "Hello"
<select id="values" name="country">
<option value="1">Hello world</option>
<option value="2">Hello there</option>
<option value="3">Hello again</option>
</select>
When Multiple words entered -> e.g. "Hello again", OR logic should be applied on the options and options containing any of the words should be remaining.
<select id="values" name="country">
<option value="3">Hello again</option>
<option value="2">Hello there</option>
<option value="1">Hello world</option>
</select>
A further enhancement which I am looking for is to group the results on the basis of number of words matched, all words matches at the top, followed by lesser words matches till the end, something like this -
I know this is a very specific requirement, but still gave a try...
I checked this question Jquery: Filter dropdown list as you type and some plugin demos given there, but did not find exactly what I am looking for. The first part JQuery UI MultiSelect has the OR search logic I am looking for, but without the grouping. But that needs jquery 1.5 and the older version which works with jquery 1.3 does not have the input field.