0

您好，我正在开发一个电话间隙应用程序并从 WCF 服务获取数据，该服务返回给我 JSON 响应。我需要在组合框中显示 DesignName 并传递相关的 designId……知道该怎么做吗？

这是json响应..

{
    "DesignResult":
    "{\"DesignId\":\"1\",\"DesignName\":\"Bedroom\"}     
     {\"DesignId\":\"2\",\"DesignName\":\"Dining\"}
     {\"DesignId\":\"5\",\"DesignName\":\"Entertainment\"}
     {\"DesignId\":\"4\",\"DesignName\":\"Occasional Tables\"}
     {\"DesignId\":\"6\",\"DesignName\":\"Office\"}
     {\"DesignId\":\"3\",\"DesignName\":\"Upholstery\"}"
}

这是我可以在选定位置获取文本的功能

var combo1 = document.getElementById("designBox");
var val = combo1.options[combo1.selectedIndex].text;

但这会给我 DesignName 因为我需要在框中显示 DesignName 但我需要获取关联的 DesignId ..

使用以下代码，我正在动态添加选项

for (var i = 0; i < jsonData.Design.length; i++) 
{
opt = document.createElement("option");  
opt.text= jsonData.Design[i].DesignName;
sel = document.getElementById("designBox");  
sel.add(opt); 
}

修改代码如下，但为 DesignId 获取“Null”

var optElement = document.createElement("option");
optElement.setAttribute('value',jsonData.Design[i].DesignId);
optElement.innerHTML = jsonData.Design[i].DesignName;

检索：

var combo1 = document.getElementById("designBox");
var test = combo1.getAttribute('value');
alert("test value is...."+test);
4

1 回答 1

0

问题出在 JSON 中。它的语法不正确。我已经为你解决了。

在此处彻底阅读和研究 JSON 。

var jsonData = '{
    "DesignResult": [
        {
            "DesignId": "1",
            "DesignName": "Bedroom"
        },
        {
            "DesignId": "2",
            "DesignName": "Dining"
        },
        {
            "DesignId": "5",
            "DesignName": "Entertainment"
        },
        {
            "DesignId": "4",
            "DesignName": "OccasionalTables"
        },
        {
            "DesignId": "6",
            "DesignName": "Office"
        },
        {
            "DesignId": "3",
            "DesignName": "Upholstery"
        }
    ]
}';

这是从服务器返回的字符串。现在使用eval()函数将其转换为 javascript JSON 对象。像，

jsonData = eval('(' + jsonData + ')');

现在您可以使用循环和所有方法来迭代这个 JSON 对象。要访问您需要的数据，您必须像这样实现它，

试试这个

var len = jsonData.DesignResult.length;

for(var i=0;i<len;i++){
alert("Name - "+jsonData.DesignResult[i].DesignName+" || ID - "+jsonData.DesignResult.DesignId);
}

要修复您的代码，

var len = jsonData.DesignResult.length;
    for (var i = 0; i < len; i++) 
        {
        opt = document.createElement("option");  
        opt.text= jsonData.DesignResult[i].DesignName;
        opt.value = jsonData.DesignResult[i].DesignId;
        //better way is
        //opt.setAttribute('value',jsonData.DesignResult[i].DesignId);
        sel = document.getElementById("designBox");  
        sel.add(opt); 
        }

我会推荐用 jQuery 来做，比如

假设您想将该“ComboBox”附加到 ID =“myCombo”的 Div（根据您的需要进行更新）

var selectElement = jQuery("<select />",{id:"mySel"});

for(var i=0;i<len;i++){
var optElement = jQuery("<option />",{value:jsonData.DesignResult[i].DesignId,text:jsonData.DesignResult[i].DesignName);
selectElement.append(optElement);
}

$("#myCombo").append(selectElement);

要访问所选元素的名称和 ID，请使用

var Name = $("#mySel").html();
var ID = $("#mySel").attr('value');

删除旧代码

通过组合框，您是指 HTML 中的 SELECT 标记吗？

我发现很难理解你到底想做什么？

动态生成下拉菜单？或者是其他东西 ？

请让我们更深入地了解您想要做什么。:)

于 2012-07-26T10:04:08.930 回答