[Pedro Garciya Lopez]

Задача сделать список со строкой фильтрации сверху. Чтобы при вводе первых символов, элементы списка не содержащие этих символов скрывались, а если вообще подходящих элементов нет, список блокируется и в нем появляется строка "совпадений не найдено".

это работает, но только в mozilla. chrome и opera не скрывают элементы. почему?!

еще хотелось бы чтобы в отфильтрованном списке выделялся первый элемент, вот с этим полная беда даже в mozille, хотя на первый взгляд может показаться что работает, если ввести букву П, все города кроме Пензы скоются, и Пенза выделится, но если потом стереть П, ввести Ж, тоже самое произойдет с Житомером, теперь стираем Ж, пробуем опять П, Пенза отфильтруется но уже не выделяется ...

голова дымится, помогите разобраться, что делаю не так?

ниже привожу код, и вот "рабочий" пример на JSfiddle http://jsfiddle.net/macmacins/wb5EF/4/

<input style="display: block" id="Filter">
<select id="cityList" size="8">
    <option>Брянск</option>
    <option>Житомер</option>
    <option>Пенза</option>
    <option>Бердянск</option>    
</select>

$("#Filter").keyup(function()
{
    var search_str = this.value.toLowerCase();
    var conc = 0;

    if (($("#cityList").attr("disabled")=="disabled"))
    {
        $("#cityList option[value='-1']").remove();
        $("#cityList").attr("disabled", false);
    }

    $("#cityList option").each(function()
    {
        if (this.text.toLowerCase().indexOf(search_str)==0)
        {
            $(this).toggle(true);
        }
        else
        {
            $(this).toggle(false);
            conc ++;
        }
    });

    if (conc == $("#cityList option").size())
    {
        $("#cityList").append($('<option value="-1">Совпадейний не найдено</option>'));
        $("#cityList").attr("disabled", true);
    }
    
    //здесь пытаюсь выделять первый элемент видимого списка
    $("#cityList :visible:first").attr("selected", "selected");
})