Sort JSON in alphabetical order

Question

I have a JSON object created based on data stored in a table. Then I need to be able to sort it in different ways, but when I do JSON.stringify(array) and try to sort, it doesn't work. When I try to just do array.sort(); , it will reorder, but ultimately won't work. I don't have much experience with JSON and how to manage it, so I'm not sure what else to try. After sorting, I need to go through and rewrite the table with the selected category in alphabetical order.

JSON is as follows:

 var arr = [{ "Functional Category":"T-Shirt", "Brand Name":"threadless", "When Obtained":"Last 3 Months", "How Obtained":"Purchased", "How Often Worn":"Monthly", "Where It Made":"India", "Has a Graphic":"Yes"}] 

I have a script here: http://jsfiddle.net/Skooljester/88HVZ/1/ , and I tried what was suggested here but couldn't get it to work.

I have two questions: one of them: how can I do this, and two: is there a better way to sort?

Answer 1

First define a comparison function:

 function compare(el1, el2, index) { return el1[index] == el2[index] ? 0 : (el1[index] < el2[index] ? -1 : 1); } 

Then, to sort the array in the first column, use this:

 array.sort(function(el1,el2){ return compare(el1, el2, "Functional Category") }); 

Or, to sort the first column AZ and the second column ZA if the first column is:

 array.sort(function(el1,el2){ var compared = compare(el1, el2, "Functional Category") return compared == 0 ? -compare(el1, el2, "Brand Name") : compared; }); 

Answer 2

see below code ...

 function sortObject(o) { var sorted = {}, key, a = []; for (key in o) { if (o.hasOwnProperty(key)) { a.push(key); } } a.sort(); for (key = 0; key < a.length; key++) { sorted[a[key]] = o[a[key]]; } return sorted; } 

Does it help?

Answer 3

The Mozilla Developer Documentation provides a useful explanation of the sort function. You can provide the function as a parameter that tells the browser how to sort.

https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/sort

Some pseudo codes from this link with the added call to myArray.sort and removing the function name:

 myArray.sort(function(a, b) { if (a is less than b by some ordering criterion) return -1; if (a is greater than b by the ordering criterion) return 1; // a must be equal to b return 0; }); 

EDIT: It looks like you have a singleton array with an object as an element. Objects are unordered. You must convert it to an array before it can be sorted. Try this (with the Object.keys and Array.prototype.map functions added via augment.js for older browsers):

 var result = Object.keys(myArray[0]).sort().map(function(key) { return [key,myArray[0][key]]; }); 

This will give you a sorted, nested form array:

 [["Brand Name","threadless"], ["Function Category","T-Shirt"], ... ] 

Answer 4

Something like this might help:

  function (obj) {
    var a = [], x;
    for (x in obj) { 
      if (obj.hasOwnProperty (x)) {
          a.push ([x, obj [x]]);
      }
    }
    a.sort (function (a, b) {return a [0]> b [0]? 1: -1;})
    return a;
 }

Answer 5

If you intend to allow the user to sort the table dynamically, my approach may be slightly different.

There are many jQuery table sorting plugins. I had a good success with this: http://tablesorter.com/docs/

Allows you to sort by multiple columns, sort by default, connect to events, etc. etc....

Thus, you can create your table as you already have, and sorting can be done secondary even before the page is displayed.