Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there a jQuery Autocomplete plugin that'll force the selection of an item?

There's autocomplete, but it doesn't force the selection of an item. I need something like this but it has to force an item to be selected before you can "submit".

Does it exist?

like image 297
Shamoon Avatar asked Dec 30 '09 16:12

Shamoon


3 Answers

You can use "change" event of Autocomplete

        var availableTags = [
            "ActionScript",
            "AppleScript"
        ];
        $("#tags").autocomplete({
            source: availableTags,
            change: function (event, ui) {
                if(!ui.item){
                    //http://api.jqueryui.com/autocomplete/#event-change -
                    // The item selected from the menu, if any. Otherwise the property is null
                    //so clear the item for force selection
                    $("#tags").val("");
                }

            }

        });
like image 108
Ben W Avatar answered Nov 04 '22 23:11

Ben W


This is my solution with .blur (moreover I use name|ID pairs)

jQuery("#username").autocomplete(
    "/yii_app/stock/suggestUser",
    {
        'mustMatch':true,
        'multiple':false,
        'formatItem':function(result, i, num, term) {
            return '<small>'+result[1]+'</small>&nbsp;&nbsp;&nbsp;'+ result[0];
        }
    }
).result(
    function(event,item) {
        $("#user_id").val(item[1]);
    }
).blur(
    function() {
        $("#user_id").val('');
        $(this).search();
    }
);

user_id is a hidden input field, username is an text input field ajax result uses the following format: user1name|user1id\n user2name|user2id\n

like image 29
sis Avatar answered Nov 05 '22 01:11

sis


Use the option:

mustMatch:true,

This is available in the Bassistance autocomplete plugin. Ii do not know if it is a part of jQuery autocomplete or of Bassistance's autocomplete, but it works!

like image 30
Bhoomi Avatar answered Nov 04 '22 23:11

Bhoomi