Saurabh
Saurabh

Reputation: 1406

jQuery plugin for filtering the options in multi-select box as you type

I have a multi-select box populated with some pre-defined list. I want to filter those options as user types in the input box above it. Can anybody suggest any available jQuery plugin?

Thanks, Saurabh

Upvotes: 1

Views: 1150

Answers (1)

alex
alex

Reputation: 490233

var input = $('input'),
    select = $('select');


input.keyup(function() {
    var inputVal = $(this).val(),
        inputLength = inputVal.length;

    select.find('option').each(function() {

        if ($(this).val().substr(0, inputLength) != inputVal) {
            $(this).attr({ disabled: 'disabled' });
        } else {
            $(this).removeAttr('disabled');
        }

        select.focus();
        input.focus();

    }); 

});

jsFiddle.

The focus to select and then back is to make the browser redraw the changes, which it wasn't doing in mine (Chrome 9).

If you want them to actually be removed, you will need to remove them and re-add them as required because display: none didn't work for me.

Upvotes: 2

Related Questions