I am using jquery and looking for a autoplete that will support the mustMatch option (where the user must enter an exists item name) -> this is not a problem since there are several autopletes that do so.
The problem is that I need the autoplete will test the entered value.
For example:

1. The user enters "England".
2. A list opened with "England".
3. The user doesn't hit the list item (don't select England), but just click outside the input.
4. Most autopltes that support mustMatch will clear the input because the user doesn't select from the list. I am looking for an autoplete that will validate whether "England "exists or not and act accordingly.

Do you know such autoplete plugin? Or maybe do you know how can I modify an exists plugin to do so?

I am using jquery and looking for a autoplete that will support the mustMatch option (where the user must enter an exists item name) -> this is not a problem since there are several autopletes that do so.
The problem is that I need the autoplete will test the entered value.
For example:

1. The user enters "England".
2. A list opened with "England".
3. The user doesn't hit the list item (don't select England), but just click outside the input.
4. Most autopltes that support mustMatch will clear the input because the user doesn't select from the list. I am looking for an autoplete that will validate whether "England "exists or not and act accordingly.

Do you know such autoplete plugin? Or maybe do you know how can I modify an exists plugin to do so?

• javascript
• jquery
• jquery-ui
• autoplete

Share Improve this question Follow edited Mar 17, 2012 at 14:54 Andrew Whitaker 126k3232 gold badges295295 silver badges308308 bronze badges asked Mar 17, 2012 at 14:34 NaorNaor 24.1k5050 gold badges156156 silver badges270270 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 11

jQueryUI's autoplete can do this along with Scott González' autoSelect plugin, bined with the change event on the widget. If you include the plugin, all you should need is:

$("#auto").autoplete({
    source: ['England', 'Germany', 'Denmark', 'Sweden', 'France', 'Greece', 'Italy'],
    change: function (event, ui) {
        if (!ui.item) {
            this.value = '';
        }
    }
});

Example: http://jsfiddle/qb59C/