Question

我有jQuery调用来获取数据和UI上的下拉列表，该列表没有填充数据。我尝试了很多方法，评论的是我使用的代码。让我知道我是否在代码中做错了什么。

var questionData;
var optionData;

$(document).ready(function () {    
    $.ajax({
        url: 'coaching-assessment-tool.aspx/GetCATQuestionAndOptions',
        type: 'POST',
        dataType: 'json',
        contentType: "application/json; charset=utf-8",
        success: function (data) {            
            questionData = data.d[0];
            optionData = data.d[1];           
            console.log(questionData[0].QuestionText);
            console.log("Question Data", questionData);
            console.log("Option Data", optionData);
            //Questions
            document.getElementById('firstQuestion').innerHTML = questionData[0].QuestionText;
            document.getElementById('secondQuestion').innerHTML = questionData[1].QuestionText;
            document.getElementById('thirdQuestion').innerHTML = questionData[2].QuestionText;
            document.getElementById('fourthQuestion').innerHTML = questionData[3].QuestionText;
            document.getElementById('fifthQuestion').innerHTML = questionData[4].QuestionText;
            document.getElementById('sixthQuestion').innerHTML = questionData[5].QuestionText;
            document.getElementById('seventhQuestion').innerHTML = questionData[6].QuestionText;
            document.getElementById('eighthQuestion').innerHTML = questionData[7].QuestionText;
            document.getElementById('ninthQuestion').innerHTML = questionData[8].QuestionText;
            document.getElementById('tenthQuestion').innerHTML = questionData[9].QuestionText;
            //Responses
            //var ddlFirstResponse = document.getElementById('#ddlFirstResponse');
            //ddlFirstResponse.empty();
            $(function () {
                $('#ddlFirstResponse').append($("<option></option>").val('').html(''));
                $.each(optionData, function (key, value) {
                    //console.log('option: ' + value.OptionText + ' | id: ' + value.OptionId);
                    //$('#ddlFirstResponse').append($("<option></option>").val(value.OptionId).html(value.OptionText));
                    $("#ddlFirstResponse").append("<option value='" + value.OptionId + "'>" + value.OptionText + "</option>");
                });
            });            
        },
        error: function (error) {
            console.log(error);
            alert('Error retrieving data. Please contact support.');
        }        
    });
    
});


<asp:DropDownList ID="ddlFirstResponse" runat="server"></asp:DropDownList>

Answer 1

获取返回的数据时，您的数据返回处理程序有点不正确，您可以执行以下操作来减轻这种情况：

function (data, status) {
    var json = data;
    obj = JSON.parse(json);
    var opt = null;
    $("#targetIDOfControl").empty();

    for (i = 0; i < obj.People.length; i++) {
        if (i < obj.People.length) {
            opt = null;
            opt = document.createElement("option");
            document.getElementById("targetIDOfControl").options.add(opt);

            opt.text = obj.People[i].Name;
            opt.value = obj.People[i].ID;
        }
    }

上面的示例创建一个选项，然后设置其文本和值。然后根据返回的JSON数组中的索引数量复制更多选项。

Answer 2

由于我收到回复的时间有点晚，所以我进行了反复试验，终于使它起作用。这是我为使其工作而进行的代码更改。

var ddlFirstResponse = **$("[id*=ddlFirstResponse]");**            
            ddlFirstResponse.empty();
            $(function () {
                ddlFirstResponse.append($("<option></option>").val('').html('-- Select value --'));
                $.each(industryOptionData, function (key, value) {
                    //console.log('option: ' + value.OptionText + ' | id: ' + value.OptionId);
                    ddlFirstResponse.append($("<option></option>").val(value.OptionId).html(value.OptionText));
                    //ddlFirstResponse.append("<option value='" + value.OptionId + "'>" + value.OptionText + "</option>");
                });
            });

// var ddlFirstResponse = document.getElementById（'ddlFirstResponse'）; ->失败 var ddlFirstResponse = $（“ [id * = ddlFirstResponse]”）; ->有效

下拉列表（Asp.net Web表单）未填充数据

2 个答案: