Question

您好我有以下html

<select id="fld_base_profile_id" defaultValue="-1" class="m-wrap span10" field="fld_base_profile_id" appEditor="true"></select>

我在我的ajax中有这个

$result['analyze_type'][]   = array ("id" => $row[idatabase::FIELD_ID], "name" => $row[idatabase::FIELD_PROFILE_NAME]);
echo json_encode($result);

和js部分（顺便说一句，我使用的是Prototype.js）：

var JSON    = transport.responseText.evalJSON();

在控制台中，我的JSON.analyze_type看起来像这样

Array[1]
0: Object
id: "939"
name: "Reaktif İndüktif Kontrolü Ana Profili"

问题是，我如何解析这个JSON数据，以便它可以改变我的html，如

<option value="id">name</option>  ??

编辑：解决方案：

this.baseProfile    = $("fld_base_profile_id");

var JSON    = transport.responseText.evalJSON();
    this.type   = JSON.analyze_type;
    for(var i = 0; i < JSON.analyze_type.length; i++) {
        var profile = JSON.analyze_type[i];
        var opt     = document.createElement("option");
        opt.value   = profile.id;
        opt.text    = profile.name;
        this.baseProfile.appendChild(opt);
    }

Answer 1

试试这个

var el = document.getElementById('fld_base_profile_id');

for(var i = 0; i < JSON.length; i++) {
    var profile = JSON[i],
        opt = document.createElement("option");

    opt.id = profile.id;
    opt.value = profile.name;
    el.appendChild(opt);
}

Answer 2

你可以用更清洁的方式做到这一点

首先确保在JSON响应中传递Content-Type: application/json标头 - Prototype中的所有Ajax方法都会自动将响应处理为JSON并将其放入transport.responseJSON

然后你的javascript可以清理到这个

this.baseProfile    = $("fld_base_profile_id");

var type = transport.responseJSON.analyze_type;

type.each(function(item){
    var option = new Element('option',{'value':item.id}).update(item.name);
    this.baseProfile.insert(option);
},this);

Answer 3

您可以使用JSON.Parse将您获得的JSON转换为对象。然后你可以遍历项目，将每个项目分配给<option>对象，然后将它们附加到选择。

JavaScript - populate drop down list with array说明了如何创建选项标记。

使用JSON值填写Combobox

3 个答案: