Question

I have this code:

$.get('http://mapit.mysociety.org/areas/'+ulo, function(response) {

                        console.log(response);

                        var areaList = [];

                        for (var k in response) {
                                 var obj = response[k];
                                 areaList.push(obj);
                                 console.log(response[k]);

                            }
                        var len = areaList.length;

In Chrome, it works great, for example, change +ulo to wembley.

On the Chrome Dev Tool, I get the object as per the two console.log’s under the heading object:

Object
index_fb.js:41
[
Object
all_names: Object
codes: Object
country: “E”
country_name: “England”
generation_high: 18
generation_low: 1
id: 8258
name: “Wembley Central”
parent_area: 2488
type: “LBW”
type_name: “London borough ward”
proto: Object

But, same in firefox and i get this in the Firebug:

{“8258”: {“parent_area”: 2488, “generation_high”: 18, “all_names”: {}, “id”: 8258, “codes”: {“ons”: “00AEHE”, “gss”: “E05000104”, “unit_id”: “11458”}, “name”: “Wembley Central”, “country”: “E”, “type_name”: “London borough ward”, “generation_low”: 1, “country_name”: “England”, “type”: “LBW”}}

index_fb.js (line 41)

{

index_fb.js (line 48)

“

index_fb.js (line 48)

8

index_fb.js (line 48)

2

index_fb.js (line 48)

5

index_fb.js (line 48)

8

index_fb.js (line 48)

“

index_fb.js (line 48)

:

index_fb.js (line 48)

index_fb.js (line 48)

{

index_fb.js (line 48)

“

index_fb.js (line 48)

p

index_fb.js (line 48)

a

index_fb.js (line 48)

r

index_fb.js (line 48)

e

index_fb.js (line 48)

n

index_fb.js (line 48)

t

index_fb.js (line 48)

_

index_fb.js (line 48)

a

index_fb.js (line 48)

r

index_fb.js (line 48)

e

index_fb.js (line 48)

a

index_fb.js (line 48)

“

index_fb.js (line 48)

:

index_fb.js (line 48)

index_fb.js (line 48)

2

index_fb.js (line 48)

4

index_fb.js (line 48)

8

index_fb.js (line 48)

8

index_fb.js (line 48)

, etc etc

So, the Console.log(response) is right, but it seems to take every letter in the:

for (var k in response) {

k = numbers in firefox, where as in chrome, it deals with k as a whole number 8258.

How do I get around this so it works on both ?

Thanks

EDIT

This is the new code: Still the same issue:

$.get('http://mapit.mysociety.org/areas/'+ulo, function(response)  {

                        console.log(response);

                        var areaList = [];

                        for (var k in response) {

                            if (response.hasOwnProperty(k)) { 
                                 var obj = response[k];
                                 areaList.push(obj);
                                 }
                            }

I have also tried, but do I need to wrap the Get into a $.ajax to ensure it knows a json is returned. The app has an issue with using ajax to a none secure source.

So far no joy 🙁

Answer 1

Firefox considers your object to be a string. You should specify dataType:"json" to retrieve a proper JSON object, which properties you will be able to enumerate. Jquery allows you to set the dataType through the final parameter of $.get :

$.get(url,successFunction,"json")