get and sort JSON array in jQuery

Question

I've read all of the related questions on here but nothing seems to work for me. I'm trying to take information from a .json file and sort it by nearest date to today and then present all the information relating to that event.

events.json

[
 {
  "title":"Event 1",
  "start": "2014-12-06T09:00:00"
 },{
  "title":"Event 2",
  "start": "2014-12-11T09:00:00"
 },{
  "title":"Event 3",
  "start": "2014-12-13T10:00:00"
 }
]

jQuery

$.getJSON( "events/events.json", function(data){
    var array = $.map(data, function (item, index) {
    console.log([item.title, item.start]);
    });
});

Instead of, as I expected, showing me Array[3] (and then the events, start date) in the console, it shows me

["Event 1", "2014-12-06T09:00:00"]
["Event 2", "2014-12-11T09:00:00"]
["Event 3", "2014-12-13T10:00:00"]

Where am I going wrong?

EDIT: Thanks for all the help so far, but I think I've not been very clear with what I'm after. I want to get the data to display

Array[3]
  {"Event 1", "2014-12-06T09:00:00"}
  {"Event 2", "2014-12-11T09:00:00"}
  {"Event 2", "2014-12-13T10:00:00"}

so that I can sort the array by date, if they are all in sub arrays, or their own arrays, I cant sort them against each other (or if I can, I don't know how, and didn't know you could!)

the console logs objects thats small enogth completly, so [item.title, item.start] is only a length of 2, u can try to store it in an array and log it after to get an other output — UnskilledFreak
– UnskilledFreak, Commented Dec 11, 2014 at 15:58

pidupuis · Accepted Answer · 2014-12-11 18:33:45Z

1

If I understand well you simply want to display an array of 3 tuples instead of three arrays.

var parentArray = [];
$.getJSON( "events/events.json", function(data){
    $.map(data, function (item, index) {
        parentArray.push( { 'title': item.title, 'start': item.start } );
    });
});
console.log(parentArray);

Your result will be:

[
    { 'title': 'Event 1', 'start': '2014-12-06T09:00:00' },
    { 'title': 'Event 2', 'start': '2014-12-11T09:00:00' },
    { 'title': 'Event 3', 'start': '2014-12-13T10:00:00' }
]

edited Dec 11, 2014 at 18:33

answered Dec 11, 2014 at 16:21

pidupuis

3731 gold badge7 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Chris Traverse Over a year ago

I dont want the three tuples to be arrays. I want them to be {'label':'value', 'label2':'value2'} if you understand me, so that they can be sorted by date.

Chris Traverse Over a year ago

Brilliant, that's done it. I was trying to bring the value names with it from the JSON file rather than just setting them new ones that are the same, which is a much better idea!

Panos Bariamis · Accepted Answer · 2014-12-11 16:18:04Z

1

jQuery map function has two arguments. Index and item. Index comes first.

You want an array of arrays. Each inner array will have the two values.

So write

$.getJSON( "events/events.json", function(data){
    var vals = [];
    var array = $.map(data, function (index, item) {
        vals.push([item.title, item.start]);
    });
    console.log(vals);
});

see here

edited Dec 11, 2014 at 16:18

answered Dec 11, 2014 at 16:03

Panos Bariamis

4,6717 gold badges41 silver badges63 bronze badges

3 Comments

Chris Traverse Over a year ago

even with index and item switched it still displays as before, 3 arrays of 2 items instead of the desired one array of 3 items with 2 values each.

Panos Bariamis Over a year ago

sorry for this. i updated my answer and jsfiddle too

Chris Traverse Over a year ago

That's put the Array[2]'s inside an Array[3] but i'm trying to get it so it's a bunch of {value:thing, value:thing} inside an Array[3] so then they can be sorted

Dario Griffo · Accepted Answer · 2014-12-11 16:01:29Z

0

use underscore sortBy and do something like

$.getJSON( "events/events.json", function(data){
    var now = new Date();
    var sortedArray  = _.sortBy(data, function (item) {
            return CALCULATEDIFFBETWEENDATES(now,item.start);
        });
});

answered Dec 11, 2014 at 16:01

Dario Griffo

4,3223 gold badges21 silver badges35 bronze badges

7 Comments

Chris Traverse Over a year ago

If I do this, everything in the console becomes 'undefined'.

Dario Griffo Over a year ago

You should implement some things, if you expect that everybody solves all the problems without using a single piece of effort that's not right man

Chris Traverse Over a year ago

I did implement some things, and they didn't work, hence I asked about it. If that isn't what this place is for then please, enlighten me

Dario Griffo Over a year ago

Did you implemented CALCULATEDIFFBETWEENDATES, did you included underscorejs file? Did you read the doc? Mine was just a guide.

Chris Traverse Over a year ago

yes, I did all of those things, and it came up with undefined in the console. I did eventually get it to work (because I did those previously mentioned things), and your method was still incorrect.

|

Collectives™ on Stack Overflow

get and sort JSON array in jQuery

3 Answers 3

2 Comments

3 Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

3 Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related