filling combobox from JSON(by string)

Question

I just want to fill combobox by JSON. (using jquery mobile) for example: this is my string (JSON):

var response = [{
      "A":"a2",
      "B":"b2",
      "C":"c2"
     },
     {
      "A":"a3",
      "B":"b3",
      "C":"c3"
    },
    {
      "A":"a4",
      "B":"b4",
      "C":"c4"
    }];

and this is my code:

...

<div>
<h1>Choose:</h1>
    <select name="myDropDownA" id="myDropDownA">
        <option>myOption</option>  
    </select>
    <select name="myDropDownB" id="myDropDownB">
        <option>myOption</option>  
    </select>
    <script>
     $(response.A).each(function()
             {
                 var option = $('<option />');
                 option.attr('value', this.value).text(this.label);
                 $('#myDropDownA').append(option);
             });
    </script>
    <INPUT type="button" value="Mybutton" onclick="Mybutton" />
    </div>

I want myDropDownA to be the selecting option A, myDropDownB to be the selecting option B. and it's not working. why?

Probably because `response.A` is `undefined`. `response` is an **array**. See [Access / process (nested) objects, arrays or JSON](http://stackoverflow.com/q/11922383/218196). I'm also wondering what you think `this` is inside the `.each` callback. Where to do the `label` and `value` properties suddenly come from? — Felix Kling, May 09 '14 at 08:12

jhyap · Accepted Answer · 2014-05-10T02:51:06.670

0

Your $each is wrong. Check reference

var myDropDownA = $("#myDropDownA");
var myDropDownB = $("#myDropDownB");
$.each(response, function(index,obj)
{
     //alert(index + ": " + obj.A);
    myDropDownA.append($("<option />").val(obj.A).text(obj.A));
    myDropDownB.append($("<option />").val(obj.B).text(obj.B));
});

Working demo: JSfiddle

edited May 10 '14 at 02:51

answered May 09 '14 at 08:33

jhyap

3,779
6
27
47

you can further factorize the working demo code by reference to my latest updated answer. Good luck and enjoy. – jhyap May 10 '14 at 02:52

filling combobox from JSON(by string)

1 Answers1