Question

I am trying to learn how to make API calls with JSON and I am getting an “undefined” result. The API is for an invoice web app (http://www.curdbee.com) and I am wanting the results to be a list of each client name. Right now, I get a list but each result is “undefined”. Here is my jQuery code so far:

$(function () {
    $.getJSON('https://nspirelab.curdbee.com/clients.json?api_token=', function (data) {
        $.each(data, function (index, item) {
            $('#results').append('<div class="invoice">' + item.name + '</div>');
        });
    });
});

Also, in the actual script, my api token is included.

Answer 1

According to the API docs for /clients, you’re missing a property lookup — the client of item.client.name.

$(function () {
    $.getJSON('https://nspirelab.curdbee.com/clients.json?api_token=', function (data) {
        $.each(data, function (index, item) {
            $('#results').append('<div class="invoice">' + item.client.name + '</div>');
        });
    });
});

This is needed to retrieve values of the inner objects:

[                                  // == data
    {                                  // == item
        "client": {                        // == item.client
            "id": 6364,                        // == item.client.id
            "name": "7Seven7 Insurance Inc",   // == item.client.name
            ...
        }
    },
    ...
]