2015-11-20 3 views
0

Я получаю объект jsonString в моем вызове ajax. Скажите, как мне печатать этот объект в виде выпадающего списка.Как напечатать объект JSON String как выпадающий список в javascript

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

Вот мой код:

<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> 
+1

Пожалуйста, покажите нам, что вы пробовали до сих пор, и почему это не делает то, что вы ожидаете. –

+0

Вы используете jQuery? –

+0

Возможный дубликат [jquery fill dropdown с данными json] (http://stackoverflow.com/questions/5952284/jquery-fill-dropdown-with-json-data) – nafas

ответ

0

Пусть говорят 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); 

Использование 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); 
} 

Также посмотреть here

+0

Я получаю эту jsonstring из backend.this объект имеет динамический data.is есть ли способ, чтобы показать мой jsonstring как ниспадающий – mvswetha

+0

@mvswetha сообщения полного код, как вы поражающий сервер и получать ответ –

+0

mvswetha

0

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);

+0

что такое l .for (var i = 0, l = row.length; i mvswetha

+0

он такой же, как для (var i = 0; i " + item.name + ""; } – chsword

0

Используя простой цикл вы можете прочитать каждое значение и сделать поле выбора

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>

0

Вот рабочая скрипку: 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>'; 
} 
Смежные вопросы