How can I put JSON data into a jQuery/Javascript array for later use?

Question

I have some code like this:

var data = // coming in from AJAX and confirmed working, don't need to wory about this...

var row = // cloning an existing HTML structure in the DOM

for (i = 0; i < data.length; i++) {
    var rowclone = row.clone();
    var orderLastChangedTime = new Date(data[i].createDate);
    var diffDays = Math.round(Math.abs((currentTime.getTime() - orderLastChangedTime.getTime())/(oneDay)));
    rowclone.find(".home-order-calc").text(diffDays);
    rowclone.find(".home-order-status").text(data[i].status);
    rowclone.find(".home-order-po-number").text(data[i].poNumber);
    rowclone.find(".home-order-number").text(data[i].orderId);
    rowclone.find(".home-order-last-changed").text(orderLastChangedTime);
    rowclone.find(".home-order-lines").text(data[i].itemsCount);
    rowclone.find(".home-order-cost").text(data[i].cost);
    var rowstatus = rowclone.find(".home-order-status").text();
    rowstatus = rowstatus.toUpperCase();
    openJSONitems = [];
    closedJSONitems = [];
    otherJSONitems = [];
    if (status[rowstatus] == "open") {
        openJSONitems.push(rowclone);
    }
    else if (status[rowstatus] == "closed") {
        closedJSONitems.push(rowclone);
    }
    else {
        otherJSONitems.push(rowclone);
    }
    console.log(openJSONitems);
    openJSONitems.appendTo("#home-table-orders");
}

I am trying to create 3 new JavaScript arrays and array push data into them based on sort criteria from the JSON payload. Once they are sorted I want to hang on to them and attach them to the DOM on some user actions... what am I doing wrong?

openJSONitems is an array, it doesn't have the appendTo method, you'll have to iterate over that array and append its elements to "#home-table-orders". Besides, you're creating a new array in each iteration. — acontell
– acontell, Commented Jan 6, 2015 at 20:01

acontell · Accepted Answer · 2015-01-06 20:15:25Z

openJSONitems is an array, it doesn't have the appendTo method, you'll have to iterate over that array and append its elements to "#home-table-orders". Besides, you're creating a new array in each iteration. I think this changes would fix the problem. You could also avoid the last loop inserting the element directly when status[rowstatus] == "open" if you liked.

var openJSONitems = [],
closedJSONitems = [],
otherJSONitems = [];    
var data = // coming in from AJAX and confirmed working, don't need to wory about this...

var row = // cloning an existing HTML structure in the DOM

for (i = 0; i < data.length; i++) {
    var rowclone = row.clone();
    var orderLastChangedTime = new Date(data[i].createDate);
    var diffDays = Math.round(Math.abs((currentTime.getTime() - orderLastChangedTime.getTime())/(oneDay)));
    rowclone.find(".home-order-calc").text(diffDays);
    rowclone.find(".home-order-status").text(data[i].status);
    rowclone.find(".home-order-po-number").text(data[i].poNumber);
    rowclone.find(".home-order-number").text(data[i].orderId);
    rowclone.find(".home-order-last-changed").text(orderLastChangedTime);
    rowclone.find(".home-order-lines").text(data[i].itemsCount);
    rowclone.find(".home-order-cost").text(data[i].cost);
    var rowstatus = rowclone.find(".home-order-status").text();
    rowstatus = rowstatus.toUpperCase();

    if (status[rowstatus] == "open") {
        openJSONitems.push(rowclone);
    }
    else if (status[rowstatus] == "closed") {
        closedJSONitems.push(rowclone);
    }
    else {
        otherJSONitems.push(rowclone);
    }
}

console.log(openJSONitems);
for (i = 0; i < openJSONitems.length; i++) {
  $(openJSONitems[i]).appendTo("#home-table-orders");
}

Gary Storey · Accepted Answer · 2015-01-06 20:05:38Z

0

You could add then as a data element onto a DOM object.

$('body').data('openItems', openJSONitems);

And retrieve them later:

var items = $('body').data('openItems');

answered Jan 6, 2015 at 20:05

Gary Storey

1,7822 gold badges15 silver badges19 bronze badges

Comments

Hal Helms · Accepted Answer · 2015-01-06 20:12:57Z

0

Have you considered using localStorage?

localStorage.setItem('openJSONitems', openJSONitems );

And retrieving it with...

var openJSONitems = localStorage.getItem('openJSONitems');

answered Jan 6, 2015 at 20:12

Hal Helms

1

Collectives™ on Stack Overflow

How can I put JSON data into a jQuery/Javascript array for later use?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related