使用带有ASP.NET MVC WebAPI的JQuery将值绑定到HTML下拉列表 – 无法读取未定义的属性“0”

2023年6月10日 200次阅读

我试图使用webapi url中的
JQuery填充html drowpdown的值. JSON返回值,我使用alert函数验证了它.但是,当我将它们绑定到下拉列表时,它不会填充值.

Chrome开发人员工具控制台显示错误：

“无法读取未定义的属性’0′.

@section scripts {

<script src="~/Scripts/jquery-1.8.2.js" type="text/javascript"></script>
<script src="~/Scripts/jquery-ui-1.8.24.min.js" type="text/javascript"></script>

<script type="text/javascript">

    $(document).ready(function() {
        var testDdl = $('#test');
        $.ajax({
            url: "/api/Values",
            type: "Get",
            success: function(data) {
                for (var i = 0; i < data.length; i++) {
                    testDdl.append($("<option/>"), {
                        value: this.data[i],
                        html: this.data[i]
                    });
                }
            },
            error: function(msg) { alert(msg); }
        });
    });
</script> }

<body>

<form>
    <select id="test"></select>
</form> </body>

请帮我解决这个问题.

最佳答案 如果您确定数据对象是正确的(它必须只是一个字符串数组),这应该工作：

success: function(data) {
   for (var i = 0; i < data.length; i++) {
       var option = $("<option/>");
       option.attr("value", data[i]).text(data[i]);
       testDdl.append(option);
    }
 },

以下是它的一个小提琴：
http://jsfiddle.net/aq8X5/5/

点赞