jQuery / Javascript appending option items to a select in IE7/8

Question

I have the following code which gets an array of names and values from a json request and appends them to a select item in a html page.

It works for me so far in all browsers except IE in which instead of the expect result

<option value="211">Bakery and Cafe</option>

I get a result

<option value="211"/>

Javascript:

$.getJSON(link,function(data) {
                $('#CltOrgType').find('option').remove().end();
            for (key in data){
                alert(data[key][0],data[key][1]);
                var option = new Option(data[key][0],data[key][1],false,false);
                $('#CltOrgType').append(option);
            }
        });

The JSON response looks like the following

[[ "Asian Cuisine" , "200" ], [ "Bakery and Cafe" , "211" ], [ "Breakfast, Lunch & Snacks" , "215" ], [ "Cafe" , "195" ], [ "Fully Licensed Restuarant" , "205" ], [ "Japanese Cuisine" , "210" ], [ "Licensed Italian Cuisine" , "206" ], [ "Middle Eastern Cuisine" , "209" ], [ "Pizza Restaurant" , "199" ], [ "Salads, Soups & Sandwiches" , "213" ], [ "Sandwiches and Wraps" , "207" ], [ "Sushi" , "214" ], [ "Take Away" , "208" ], [ "Yoghurt and Salads" , "212" ]]

and all browsers display the correct information with console.log(data[key][0] +","+data[key][1]) or alert(data[key][0] +","+data[key][1])

Any ideas, solutions or thoughts would be highly appreciated! As this ones got me stuck for a while

Joseph · Accepted Answer · 2013-02-11 03:13:01Z

1

Why are you using a for-in on an array? And did you know you can use jquery to create elements on the fly?

$.getJSON(link,function(data) {

  var cot = $('#CltOrgType');

  cot.empty();

  $.each(data,function(i,val){
    $('<option/>',{
      value : val[1]
    })
    .text(val[0])
    .appendTo(cot);
  });
});

answered Feb 11, 2013 at 3:13

Joseph

120k31 gold badges186 silver badges238 bronze badges

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

1 Comment

Tim Kalinowski Over a year ago

Thanks Joseph, I'm still learning and it was bad practice on my behalf after looking at various examples looping through json objects. Thanks for clarifying and explaining the jQuery functionality better.

Collectives™ on Stack Overflow

jQuery / Javascript appending option items to a select in IE7/8

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related