sorting json data in javascript

Question

Below is the json data that I have which contains array of states. The size of array is always 2, but the order of elements of the array is not fixed. The array elements values can be null. The sample data is as shown below:

{
   "status": "SUCCESS",
   "status_message": "Susscessfully queried details.",
   "total_records": 2,
   "m_details":
   [
       {
           "p_id": 1023,
           "pname": "india",
           "states":
           [
               {
                   "state": "karnataka",
                   "capital": "bangalore"
               },
               {
                   "state": null,
                   "capital": null,
               }
           ]
       },
       {
           "p_id": 1023,
           "pname": "india",
           "states":
           [
               {
                   "state": null,
                   "capital": null
               },
               {
                   "state": "Tamilnadu",
                   "capital": "chennai"
               }
           ]
       }
   ]
}

My questions:

How to convert the null values to some default text say "-".
How can I sort all the states in asc or desc order.

You can read this post to see how to order a json object: http://stackoverflow.com/questions/11099610/generic-way-of-sorting-json-array-by-attribute — TlonXP, Apr 09 '14 at 02:44
To convert null values to text, you'll need to write a for loop to go through the array and a for..in loop to go through each key in the object. Check if each value == null and set the value to the the string you want. — Ben Wong, Apr 09 '14 at 02:47
one more http://stackoverflow.com/questions/881510/jquery-sorting-json-by-properties — spiderman, Apr 09 '14 at 02:52

score 0 · Answer 1 · answered Apr 09 '14 at 02:50

Just for your information javascript array objects have a sort function that implements some basic built in sorting functionalities. If you need to perform a more specific sorting (you do) you can always passing in a function to the sort function and implement your own custom logic. This article from W3Schools has some examples which quoting one of them here...

var points = [40,100,1,5,25,10];
points.sort(function(a,b){return b-a}); //sorts numbers in descending order

Now, to "convert" null values to a '-' literal I guess you will need to add more details to your question so I can provide a good solution. Why do you need to convert them? Where's this json coming from?

I am using AngularJs to loop through the m_details and display the state details in two columns. There are only two columns namely Karnataka and Tamilnadu.I need to pull the state details from the json correctly and populate the correct td even if the state array is not arranged consistently in the json. I am getting this json data from a REST service. — Pradeep, Apr 09 '14 at 03:03

jfriend00 · Accepted Answer · 2014-04-09T04:21:15.597

You can iterate through all elements in your data to switch any null values to "-" with an iterator with a callback like this.

function iterateObject(item, callback) {
    if (typeof item === "object" && item !== null) {
        if (item instanceof Array) {
            for (var i = 0; i < item.length; i++) {
                item[i] = iterateObject(item[i], callback);
            }
        } else {
            for (var prop in item) {
                if (item.hasOwnProperty(prop)) {
                    item[prop] = iterateObject(item[prop], callback);
                }
            }
        }
    } else {
         // call the callback on any item that is not an array or object
         return callback(item);
    }
    return item;
}


var data = {
   "status": "SUCCESS",
   "status_message": "Susscessfully queried details.",
   "total_records": 2,
   "m_details":
   [
       {
           "p_id": 1023,
           "pname": "india",
           "states":
           [
               {
                   "state": "karnataka",
                   "capital": "bangalore"
               },
               {
                   "state": null,
                   "capital": null,
               }
           ]
       },
       {
           "p_id": 1023,
           "pname": "india",
           "states":
           [
               {
                   "state": null,
                   "capital": null
               },
               {
                   "state": "Tamilnadu",
                   "capital": "chennai"
               }
           ]
       }
   ]
};

// iterate through the object and convert all `null` values to `"-"`
iterateObject(data, function(item) {
    return (item === null) ? "-" : item;
});

You can then sort each of the states arrays like this:

function sortStates(item) {
    var array = item.m_details;
    for (var i = 0; i < array.length; i++) {
        array[i].states.sort(function(a, b) {
            return a.state.localeCompare(b.state);
        });
    }
}

sortStates(data);

If you want the opposite sort order, then just swap the arguments a and b in the .sort() callback.

Working demo: http://jsfiddle.net/jfriend00/MTQ86/

sorting json data in javascript

2 Answers2