Geek Answers Handbook

JQuery getJSON does not support original order

Having the following file (customers.json):

{"3":"Andy", "1":"Bruce", "4":"Charlie", "2":"David"}

Using this code:

 jQuery.getJSON("/Customers.json", function (data) { console.log(data); });

As a result, you get the following:

 {"1":"Bruce", "2":"David", "3":"Andy", "4":"Charlie"}

My Json is targeted alphabetically by name, but this code seems to be entered in numerical order. Is this a feature? And how can I stop this?

Does it matter, I'm using Firefox 39.0

EDIT:

The real question here is, is there anyway to do this, preserving ALL the data and maintaining the order in which it is received?

+5
source share
5 answers

What your Json SHOULD looks like:

 [{"id":"3", "name":"Andy"}, {"id":"1", "name":"Bruce"}, {"id":"4", "name":"Charlie"}, {"id":"2", "name":"David"}]

What you submit is a series of objects (clients), so your data structure should ideally reflect this. And by passing it as an array, you can keep order, as already mentioned.

+4
source

If you care about the order, you should provide a list in a JSON response.

But in this case, your data is incorrect,

 response = [{"3":"Andy"},{"1":"Bruce"},{"4":"Charlie"},{"2":"David"}]

And then:

  $.each(response ,function(index,v){ console.log(v) // or //console.log(data[index]) //And to get the number and name, you must do some trick for (let [key, value] of Object.entries(v)) { console.log(number,value); } })

The best solution

You must use the key for the number, what is this number? id , rank ?

  response = [{"id":3,"name":"Andy"},{"id":1,"name":"Bruce"},{"id":4,"name":"Charlie"},{"id":2,"name":"David"}]

And then:

  $.each(response ,function(index,value){ console.log('Id:',value.id,'Name:',value.name); });
0
source

When a string passing through a wire is converted to a Javascript object (an object representing JSON data), what you end up with is a object like any other with properties and values. There is no ordering of properties in the object.

Object created from JSON:

 {"3":"Andy", "1":"Bruce", "4":"Charlie", "2":"David"}

identical to the object created using this Javascript:

 obj = {}; // <-- Not an array! obj[1] = 'Andy'; obj[2] = 'Bruce'; obj[3] = 'Charlie'; obj[4] = 'David';

If you want to display the object in order of the value property, you need to first load the values ​​into the array, and then sort the array alphabetically.

Sort of:

 var sorted = []; for (var prop in data) { if (data.hasOwnProperty(prop)) { sorted(json[prop]); } } sorted.sort(); console.log(sorted);
0
source

anyway, to do this, keeping ALL the data and maintaining order

Try using $.map() , Array.prototype.sort() to return an array of values, properties of the returned object

 var json = { "3": "Andy", "1": "Bruce", "4": "Charlie", "2": "David" }; var res = $.map(json, function(val, key) { // keep all data, maintain order // return array having value as string with comma "," // as separator between `val` from object `key` from object // `val`: `Andy` , `key`: `3` return [ val + ", " + key ] }).sort(); console.log(res); document.body.textContent = res; 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
0
source

Is this a function?

Yes, it seems, the order of properties of an object can be before implementation. Some browsers maintain order, and some do not. This is what the ES5 specification says :

The mechanics and order of listing properties (step 6.a in the first algorithm, step 7.a in the second) is not indicated.

So, once you get the JavaScript object from the JSON literal, the order of the properties can be lost.

And how do I stop this?

Is there a way to do this by storing ALL the data and maintaining the order in which it is received?

The only real way to solve the problem is to explicitly specify the order of the objects.

0
source

More articles:


All Articles