I am using the following JSON to create few checkboxes using JavaScript.

{"5":"5.5\" x 8.5\"",
"11":"7\" x 10\"",
"4":"8.5\" x 11\"",
"8":"8.5\" x 14\"",
"12":"10\" x 7\"",
"2":"11\" x 8.5\"",
"10":"11\" x 17\"",
"6":"14\" x 8.5\"",
"9":"17\" x 11\""})

The JavaScript to create those checkboxes is:

for(id in dimensions) {
    $("#the_dimensions").append('<label class="checkbox">' + 
                                '<input type="checkbox" class="dimensions-filter" value="' + id + '">' +
                                dimensions[id] + '</label>');
}

On Firefox, the checkbox is created as per the order in the JSON object. So, "5":"5.5\" x 8.5\"" bees the first element, "11":"7\" x 10\"" bees the second element, so on.

But on Chrome and IE, the JSON object gets sorted automatically in an ascending order of keys. So, "2":"11\" x 8.5\"" bees the first element, "4":"8.5\" x 11\"" bees the second element, so on.

How can I disable auto sorting on Chrome and IE?

I am using the following JSON to create few checkboxes using JavaScript.

{"5":"5.5\" x 8.5\"",
"11":"7\" x 10\"",
"4":"8.5\" x 11\"",
"8":"8.5\" x 14\"",
"12":"10\" x 7\"",
"2":"11\" x 8.5\"",
"10":"11\" x 17\"",
"6":"14\" x 8.5\"",
"9":"17\" x 11\""})

The JavaScript to create those checkboxes is:

for(id in dimensions) {
    $("#the_dimensions").append('<label class="checkbox">' + 
                                '<input type="checkbox" class="dimensions-filter" value="' + id + '">' +
                                dimensions[id] + '</label>');
}

On Firefox, the checkbox is created as per the order in the JSON object. So, "5":"5.5\" x 8.5\"" bees the first element, "11":"7\" x 10\"" bees the second element, so on.

But on Chrome and IE, the JSON object gets sorted automatically in an ascending order of keys. So, "2":"11\" x 8.5\"" bees the first element, "4":"8.5\" x 11\"" bees the second element, so on.

How can I disable auto sorting on Chrome and IE?

• javascript
• json
• google-chrome
• object
• internet-explorer

• 5 Javascript objects are not ordered. Therefore they cannot be sorted. – Waleed Khan Commented Jan 30, 2013 at 14:43
• 3 If you want to ensure order, use an array of objects, e.g., [{"5":"5.5\" x 8.5\""}, {"11":"7\" x 10\""},...] – apsillers Commented Jan 30, 2013 at 14:48
• 1 possible duplicate of Ordered JSONObject – epascarello Commented Jan 30, 2013 at 14:55
• 1 Thank you all for ments. While I was trying to use your suggestions, I found an alternate way to solve my problem. I replaced id with name and vice versa. As I sort by name, it solved my problem. – Debiprasad Commented Feb 5, 2013 at 8:45
• This question is similar to: How do you stop Chrome and Opera sorting JSON objects by Index ASC?. If you believe it’s different, please edit the question, make it clear how it’s different and/or how the answers on that question are not helpful for your problem. – mickmackusa Commented Dec 7, 2024 at 3:27

1 Answer 1

Same Problem here. My JSON-object looks like this:

{
  "15" : { "name" : "abc", "desc" : "Lorem Ipsum" },
  "4"  : { "name" : "def", "desc" : "Foo Bar Baz" },
  "24" : { "name" : "ghi", "desc" : "May be" },
  "8"  : { "name" : "jkl", "desc" : "valid" }
}

The object is sorted by name at server (A-Z glossary) and I want to render a list with:

var data = myObject, i;

console.log(data);

for (i in data) {
    if (data.hasOwnProperty(i)) {
         // do stuff
    }
}

Chrome logs:

Object {4: Object, 8: Object, 15: Object, 24: Object}

and my for-in loop results in wrong sort. It's automatically sorted by the browser, but I need the IDs.

My solution:
I decided to change the keys with a prefixed underscore. My object looks now:

{
  "_15" : { "name" : "abc", "desc" : "Lorem Ipsum" },
  "_4"  : { "name" : "def", "desc" : "Foo Bar Baz" },
  "_24" : { "name" : "ghi", "desc" : "May be" },
  "_8"  : { "name" : "jkl", "desc" : "valid" }
}

And Chrome logs now:

Object {_15: Object, _4: Object, _24: Object, _8: Object}

And my list is rendered correct.