заполнить / построить выпадающий с JQuery

Question

Мне нужно раскрывающееся меню для целей фильтрации в моем приложении MVC3. Я хотел бы справиться как можно больше с jquery, так как мне не нужен этот выпадающий список ни для чего, кроме фильтрации. Я знаю, что фильтрация на основе списка - это еще один шаг, но сейчас я просто сосредоточусь на раскрывающемся списке.

Пока что я создал пустой список с MVC, а затем попытался заполнить его с помощью jquery при загрузке.

Вот мой код.

<script src="http://code.jquery.com/jquery-1.5.1.min.js" type="text/javascript"/>       
<script type="text/javascript">
$(function () {
    var myOptions =
    {
        val1: '12 hours',
        val2: '24 hours'
    };
    $.each(myOptions, function (val, text) {
        $('#timeSelect').append( new Option(text,val) );
        });
});

</script>

<div id="timeSelect">
    @Html.DropDownListFor(
    x => x.FilterTimeList, 
    Enumerable.Empty<SelectListItem>(),
    "-- select Time --"
    )
</div>

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

С помощью приведенного выше кода в списке есть опция выбора времени, но никакие опции не добавляются в список на основе jquery.

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

Answer 1

Эта строка должна быть вместо текущей:

$('#timeSelect select').append( new Option(text,val) );

Более подход jquery style , с такими же результатами будет:

$('<option />').val(val).text(text).appendTo('#timeSelect select');