首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >使用jquery或JS填充Html.DropDownList

使用jquery或JS填充Html.DropDownList
EN

Stack Overflow用户
提问于 2012-04-10 02:06:30
回答 3查看 11.9K关注 0票数 1

这就是我所拥有的:

代码语言:javascript
复制
for (i = 0; i < data.length; i++) {
                $("#myDropDownLisTId").find('tbody')  
                .append($('<option>').attr('value', data[i].id).attr('name', data[i].name)
                );               
            }

但下拉列表始终保持不变。为什么这不起作用?数据变量有漂亮的值。另外,我想在for循环之前清空下拉列表/该怎么做?

以下是视图中的下拉列表:

代码语言:javascript
复制
<%= Html.DropDownList("myDropDownLisTId")%>
EN

回答 3

Stack Overflow用户

发布于 2012-04-10 02:23:30

虽然其他答案可以完成您想要做的事情,但我建议您将选项HTML写到一个字符串变量中,并在循环结束后将其追加,而不是在循环中追加。当你的列表变得更长时,这会有一些明显的性能优势。使用.html()还会在每次清空列表时进行处理。

代码语言:javascript
复制
        var tempList = '';
        for (i = 0; i < data.length; i++) {  
            tempList += '<option value="' + data[i].id + '" name="' + data[i].name +'">' + data[i].text + '</option>';            
        }
        $("#myDropDownLisTId").html(tempList);
票数 5
EN

Stack Overflow用户

发布于 2012-04-10 02:16:02

这似乎是可行的:http://jsfiddle.net/ykFJd/2/

JS

代码语言:javascript
复制
var data = [
    {id:'0', name:'test 0'},  
    {id:'1', name:'test 1'},
    {id:'2', name:'test 2'},
    {id:'3', name:'test 3'},
    {id:'4', name:'test 4'},    
];


for (var i = 0; i < data.length; i++) {
    $("#myDropDownLisTId").append(
        $('<option />', {
            'value': data[i].id,
            'name': data[i].name,
            'text': data[i].name
        })
    );               
}​
票数 1
EN

Stack Overflow用户

发布于 2012-04-10 02:19:04

我写了一个很好的函数来绑定一个js散列到一个选择列表。请访问Best way to populate select list with JQuery / Json?查看我的答案

示例用法:

代码语言:javascript
复制
// you can easily pass in response.d from an AJAX call if it's JSON formatted
var users = [ {id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}, {id: 3, name: 'Cindy'} ]
setSelectOptions($('#selectList'), users, 'id', 'name');
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/10077596

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档