Search code examples
javascriptjqueryajaxjsonyodlee

Parsing nested Yodlee JSON feed using Jquery or Javascript


I am trying to retrieve transaction details from the below Yodlee JSON resultset. I can parse "itemDisplayName" without a problem but having trouble with the jquery code when trying to parse anything nested for example: itemData -> accounts -> cardTransactions -> plainTextDescription

One dude recommended using Javascript For loops instead of jQuery but not sure...

var orgs = $.parseJSON(data);    

$(orgs.Body).each(function(i,el) {

            var new_orgs = '<div>' + el.itemDisplayName + '</div>';

            $('#response-getItemSummaries').append(new_orgs);

             });

///RAW YODLEE JSON RESULTSET

http://pastebin.com/6498mZJf

Thanks in advance!


Solution

  • instead of .each() you should use $.each():

    $.each(orgs.Body, function(i,el) {
       var new_orgs = '<div>' + el.itemDisplayName + '</div>';
       $('#response-getItemSummaries').append(new_orgs);
    });
    

    Description for $.each():

    A generic iterator function, which can be used to seamlessly iterate over both objects and arrays. Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties.

    The $.each() function is not the same as $(selector).each(), which is used to iterate, exclusively, over a jQuery object. The $.each() function can be used to iterate over any collection, whether it is an object or an array. In the case of an array, the callback is passed an array index and a corresponding array value each time. (The value can also be accessed through the this keyword, but Javascript will always wrap the this value as an Object even if it is a simple string or number value.) The method returns its first argument, the object that was iterated.

    Fiddle Demo


    what if I wanted to use $.each() to parse nested arrays such as itemData -> accounts -> cardTransactions -> plainTextDescription form the data feed that I provided?

    Oh its a late reply for your comment but this is what you should do with jQuery:

    $.each(orgs.Body, function (i, el) {
        if (el.itemData.accounts !== undefined) {
            $.each(el.itemData.accounts, function (i, el) {
                if (el.cardTransactions !== undefined) {
                    $.each(el.cardTransactions, function (i, el) {
                        if (el.plainTextDescription !== undefined) {
                            $('body').append(el.plainTextDescription + '<br/>');
                        }
                    });
                }
            });
        }
    });
    

    Get the plainTextDescription this way with jQuery