CODEWITHSUNDEEP
javascriptjson
nvaughan84
nvaughan84

Reputation: 473

How can I group data returned in JSON format and return it?

I have a JSON string of the form:

[
    {"ID":153,"CircuitID":53,"StartTime":"2014-11-12 12:45:00","EventFormatID":224,"TotalPlaces":8,"BookedPlaces":0,"ProvisionalPlaces":0},
    {"ID":161,"CircuitID":53,"StartTime":"2014-11-12 17:15:00","EventFormatID":224,"TotalPlaces":0,"BookedPlaces":0,"ProvisionalPlaces":0},
    {"ID":734,"CircuitID":53,"StartTime":"2014-11-12 18:30:00","EventFormatID":231,"TotalPlaces":14,"BookedPlaces":0,"ProvisionalPlaces":0}
]

In place of Event Format ID and Circuit ID I will be returning the names

What I need to do is group the results by Event Format ID and return the results in the following format:

Event 224 : 12:45 (8 places available), 17:15 (0 places available)
Event 231 : 18:30 (14 places available)

I can't seem to figure out how to loop through the data, group it by Event Format ID to present it in the required format!

Thanks

Upvotes: 1

Views: 1031

Answers (3)

caslaner
caslaner

Reputation: 413

Please take a look that:

http://jsfiddle.net/m260n5ud/

html

<div id="contentDiv"></div>

js

function tidyUp(jsonArray) {
    var myObject = {};
    for (i = 0; i < jsonArray.length; i++) {
        var key = jsonArray[i]['EventFormatID'];
        var time = jsonArray[i]['StartTime'].replace(' ', ':').split(/[- :]/);
        time = time[3] + ":" + time[4];
        var totalPlace = jsonArray[i]['TotalPlaces'];

        if (myObject[key] == null) {
            myObject[key] = "Event : " + key + " : " + time + " ( " + totalPlace + " places available)";
        } else {
            myObject[key] += ", " + time + " ( " + totalPlace + " places available)";
        }
    }
    console.log(myObject);

    for (var k in myObject) {
        document.getElementById('contentDiv').innerHTML += myObject[k] + "<br/>";
    }
}

Upvotes: 0

deitch
deitch

Reputation: 14581

This is easier with lodash/underscore, or even with ES5 array and object methods, but since you asked about pure JS:

var data = {}, results = [], i, j, id, time, obj, evts; // obj is your object above
for (i=0; i<obj.length; i++) {
  id = obj[i].EventFormatID;
  time = obj[i].StartTime; // you can simplify to get just the time, not the datetime, if you prefer
  data[id] = data[id] || [];
  data[id].push({"time":time,"places":obj[i].TotalPlaces});
}
// now you have a proper data structure, just print it out
for (i in data) {
  if (data.hasOwnProperty(i)) {
    // just show the output properly formatted
    evts = [];
    for (j=0;i<data[i].length;j++) {
       evts.push(data[i][j].time+" ("+data[i][j].places+" places available)");
    }
    results.push("Event "+i+" : "+evts.join(","));
  }
}

ES5 makes this so much easier

var data = {}, results = [], obj; // obj is your object above
obj.forEach(function(val,i) {
  data[val.EventFormatID] = data[val.EventFormatID] || [];
  data[val.EventFormatID].push({"time":val.StartTime,"places":val.TotalPlaces});
});
// now you have a proper data structure, just print it out
Object.keys(data).forEach(function(key) {
  var value = data[key], evts = [];
  value.forEach(function(elm) {
     evts.push(elm.time+" ("+elm.places+" places available)");
  });
  results.push("Event "+key+" : "+evts.join(","));
});

And lodash is even easier.

Upvotes: 0

DoctorMick
DoctorMick

Reputation: 6793

Can you use any additional libraries? I'd use lo-dash which would make this relatively simple:

var grouped = _.groupBy(data, "EventFormatID");
_(grouped).forEach(function (group, key) {
    console.log("Event:" + key);
    _(group).forEach(function (course) {
        console.log(course.StartTime + " (" + course.TotalPlaces + " places available)");
    });
});

Obviously the example above logs to the console but it'd be fairly simple to change to build up whatever string or object you need.

Upvotes: 1

Related Questions