Jquery动态填充选择选项选项卡

时间:2011-09-30 16:16:12

标签: jquery asp.net-mvc drop-down-menu

我正在努力实现这样的目标,

<select id="time" size="1" name="Time" disabled="disabled">
    <% foreach (string item in (List<string>)Model.OpenCloseTime[dynamicVariable].AppointmentTimes)
        {%>
            <option id="<%:item%>" value="<%:item%>">
            <%:item%></option>
        <%} 
    %>
</select>

dynamicVariable= $('#date').datepicker("getDate");

为了解决这个问题,getDate应该从日历中获取工作日的值,该日历需要根据我们从模型对象日值获得的数据动态填充选择下拉列表。

我怎么能实现这个目标?

感谢您的帮助。

2 个答案:

答案 0 :(得分:1)

我不确定dynamicVariable是什么样的,但是这里是如何使用Javascript数组填充#time

var times = ["Morning", "Afternoon", "Evening"];
for(i in times) {
    $("#time").append(
        $("<option></option>").attr("value", times[i]).text(times[i])
    );
}

编辑以回答您的评论:

连接你的清单:

List<string> items = (List<string>)Model.OpenCloseTime[dynamicVariable].AppointmentTimes;
string itemsStr = string.Join(",", items.toArray());

在javascript中打印:

var items = "<%:itemStr%>";

将字符串分解为Javascript数组:

var items_arr = items.split(",");

使用我在上面发布的内容制作选择框:

for(i in items_arr) {
    $("#time").append(
        $("<option></option>").attr("value", items_arr[i]).text(items_arr[i])
    );
}

答案 1 :(得分:1)

以下是使用jQuery填充选择列表的示例:

function setCategory(categoryList)
{
    var options = '<option value="Select by Category">Select by Category</option>';
    for (var i = 0; i < categoryList.length; i++)
    {
        options += '<option value="' + categoryList[i] + '">' + categoryList[i] + '</option>';
    };
    $("#categorySelect").html(options);
};

注意,这也使用第一行设置默认文本,这可能不是一个愿望。