0

I am using REST API to receive some data from database. The JSON received from API if of type MAP i.e. it contains key - value pairs.

In my network tab I can see the response as

{
  "items": {
    "1.7.0": [{
      "hostCount": 1
    }],
    "1.8.0": [{
      "hostCount": 8
    }],
    "9.0": [{
      "hostCount": 1
    }],
    "9": [{
      "hostCount": 1
    }],
    "10": [{
      "hostCount": 1
    }],
    "10.0": [{
      "hostCount": 1
    }],
    "11.0": [{
      "hostCount": 1
    }],
    "11": [{
      "hostCount": 1
    }],
    "12": [{
      "hostCount": 1
    }]
  },
  "totalResults": 9,
  "links": null
}

But when I am iterating this response in my javascript code using $.foreach loop the sequence is different.

self.RecordCollection = oj.Collection.extend({
  fetchSize: (self.selectedPageSize || 20),
  url: self.getQueryURL,
  model: self.reportDataModel,
  parse: function(response) {
    $.each(response.items, function(idx, elems) {
      //Some code goes here to convert key value pair to array
    }
  }
})

The sequence on UI after this foreach is something like this

{
  "items": {
    "9": [{
      "hostCount": 1
    }],
    "10": [{
      "hostCount": 8
    }],
    "11": [{
      "hostCount": 1
    }],
    "12": [{
      "hostCount": 1
    }],
    "1.7.0": [{
      "hostCount": 1
    }],
    "1.8.0": [{
      "hostCount": 1
    }],
    "9.0": [{
      "hostCount": 1
    }],
    "10.0": [{
      "hostCount": 1
    }],
    "11.0": [{
      "hostCount": 1
    }]
  },
  "totalResults": 9,
  "links": null
}

I am using Oracle JET framework on UI. The sorting displayed on UI matters a lot in this case.

Please help me in understanding at which point this sorting order is getting messed up.

Edited: Also, if I try to print the response in console on UI it looks fine in expanded view (its same as returned by API). But the consolidated json shows wrong sequence and this one is taken precedence while iterating.

enter image description here

schaturv
  • 122
  • 8
  • It's because the response is an object, and the order of keys within an object is never guaranteed. If you want this behaviour, you will need to change the response to an array instead, or convert the object to an array and sort it before you iterate. – Rory McCrossan Oct 10 '18 at 09:58
  • But there is some sorting happening at backend at query level and if I apply sort on object received on UI then the actual data coming from backend wont be retained in desired order. – schaturv Oct 10 '18 at 10:42
  • Then you need to sort by that same logic on the client side. Using an array will be a ***much*** better idea though, as the order is then guaranteed. – Rory McCrossan Oct 10 '18 at 10:43
  • @RoryMcCrossan I have edited my post with the object which I am getting on UI. Can you pls help me if there is any way to iterate the data in expanded format and not the one which is mentioned in consolidated format. I have tried foreach, for loop and also keys, values concept - Everything is taking above sequence into consideration i.e. 9,10,11,12 one. – schaturv Oct 10 '18 at 11:30
  • Exactly, this is, as I explained above, a feature of objects and is why you would be best to use an array instead if you need to maintain the order of keys. – Rory McCrossan Oct 10 '18 at 12:18
  • Why can't the response be { "items": [ { "9": { "hostCount": 1 } }, { "10": { "hostCount": 8 } },......]}.In this way the array preserves the order. Check https://stackoverflow.com/questions/34955787/is-a-javascript-array-order-guaranteed – Srikanth Ganji Oct 11 '18 at 17:49
  • @SrikanthGanji The order of addition was something different (1.7.0 being the first element) and even the same can be seen on network tab as a response to API call but the response received on UI is different (9 being the first element). – schaturv Oct 12 '18 at 04:31

0 Answers0