How to get specific value of json data

Question

I have a json object, and I want to get the specific value from each key like fetch_array in mysql. This is my json:

var jsonData = [{"Id":"1","Name":"Ariel"},
                {"Id":"2","Name":"Rick"}];

Then I want to loop them in a <select> tag with $.each function

<select>
<option value='//this should be Id key' >//this should be Name key </option>
</select>

How do I pass id into the value attribute and pass the name in the <option> tag?

adeneo · Accepted Answer · 2014-04-30 15:57:19Z

2

It's not JSON, it's a javascript array containing objects, and you'd iterate as usual

var select = document.querySelector('select');

for (var i=0; i<jsonData.length; i++) {
    var option       = document.createElement('option');
    option.value     = jsonData[i].Id;
    option.innerHTML = jsonData[i].Name;

    select.appendChild(option)
}

FIDDLE

answered Apr 30, 2014 at 15:57

adeneo

319k29 gold badges409 silver badges392 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Deepak Ingole Over a year ago

option.innerHTML == option.text ??

adeneo Over a year ago

@Pilot - Both are supported in all major browsers, innerHTML is usually faster than the text methods, but it wouldn't really matter in this case, both would work just fine.

tymeJV · Accepted Answer · 2014-04-30 15:56:40Z

1

Simple, loop and create your options, then append:

var options = "";
for (var i = 0; i < jsonData.length; i++) {
    options += "<option value=" + jsonData[i].Id + ">" + jsonData[i].Name + "</option>";
}
$("#IDofSelect").append(options);

answered Apr 30, 2014 at 15:56

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Collectives™ on Stack Overflow

How to get specific value of json data

2 Answers 2

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Related