如何在javascript中将JSON字符串对象打印为下拉列表

Question

I am getting jsonString object in my ajax call.can any one tell me how to print this object as a dropdown . 我在ajax调用中得到jsonString对象。有人可以告诉我如何将这个对象打印为下拉列表。

[
  {
    "id" : 3272,
    "name" : "a"
  },
  {
    "id" : 3255,
    "name" : "b"
  },
  {
    "id"
     : 3257,
    "name" : "c"
  },
  {
    "id" : 3253,
    "name" : "d"
  },
  {
    "id" : 3256,
    "name" : "e"
  }
]

That's my code: 那是我的代码：

<script>
  $(document).ready(function() {
    $("#customerDetails").change(function() {
      var value = $('#customerDetails :selected').text();
      $.ajax({
        type: 'GET',
        url: 'environments',
        data: {
          selectedcustomername: value
        },
        success: function(result) { //this result is my jsonstring object alert("success"); 
        }
      });
    });
  });
</script>

Answer 1

Let say myJson is 假设myJson是

{
    "myJson": [
        {
            "id": 3272,
            "name": "a"
        },
        {
            "id": 3255,
            "name": "b"
        },
        {
            "id": 3257,
            "name": "c"
        },
        {
            "id": 3253,
            "name": "d"
        },
        {
            "id": 3256,
            "name": "e"
        }
    ]
}

var options = eval(myJson);

Using jQuery to fill options 使用jQuery填充选项

var length = options.length;

for(var j = 0; j < length; j++)
{
    var newOption = $('<option/>');
    newOption.attr('text', options[j].name);
    newOption.attr('value', options[j].id);
    $('#mySelect').append(newOption);
}

Also have a look here 也看看这里

Answer 2

 var row=[{"id":3272,"name":"a"},{"id":3255,"name":"b"},{"id" :3257,"name":"c"},{"id":3253,"name":"d" },{"id":3256,"name":"e"}]; var select="<select id='x'>"; for(var i=0,l=row.length;i<l;i++){ var item=row[i]; select+="<option value='"+item.id+"'>"+item.name+"</option>"; } select+="</select>"; document.write(select);

Answer 3

By using simple for loop you can read each value and make a select box 通过使用简单的for循环，您可以读取每个值并创建一个选择框

 var v = { "myJson": [ { "id": 3272, "name": "a" }, { "id": 3255, "name": "b" }, { "id": 3257, "name": "c" }, { "id": 3253, "name": "d" }, { "id": 3256, "name": "e" } ] } // in your ajax success block write this and v is your response return by ajax var str ='<select>'; for(var i=0;i<v.myJson.length;i++){ str += '<option value="'+v.myJson[i].id+'">'+v.myJson[i].name+'</option>'; } str +='</select>'; $("body").html(str)

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <body></body>

Answer 4

Here's a working fiddle: https://jsfiddle.net/q1ekcf6z/ 这是一个有效的小提琴： https : //jsfiddle.net/q1ekcf6z/

var returnData = [{"id":3272,"name":"a"},{"id":3255,"name":"b"},{"id"
:3257,"name":"c"},{"id":3253,"name":"d"
},{"id":3256,"name":"e"}];


var options = '';

returnData.forEach(function(data){
    options+= getOption(data.name);
});

var fullDropdown = '<select>' + options + '</select>';

document.write(fullDropdown);

function getOption(textTo){
 return '<option>' + textTo + '</option>';   
}

如何在javascript中将JSON字符串对象打印为下拉列表

问题描述

4 个解决方案

解决方案1
0 2015-11-20 09:55:03

解决方案2
0 2015-11-20 09:58:00

解决方案3
0 2015-11-20 09:59:10

解决方案4
0 2015-11-20 09:59:56

如何在javascript中将JSON字符串对象打印为下拉列表

问题描述

4 个解决方案

解决方案1 0 2015-11-20 09:55:03

解决方案2 0 2015-11-20 09:58:00

解决方案3 0 2015-11-20 09:59:10

解决方案4 0 2015-11-20 09:59:56

解决方案1
0 2015-11-20 09:55:03

解决方案2
0 2015-11-20 09:58:00

解决方案3
0 2015-11-20 09:59:10

解决方案4
0 2015-11-20 09:59:56