Guide on How to Navigate JSONP Responses in Goodreads

I've been working on a project that involves pulling data from Goodreads' API in order to display the rating for a specific book. However, I've hit a bit of a snag.

Upon requesting data from this URL (

https://www.goodreads.com/book/review_counts.json?isbns=9781630586799&key=YOUR_KEY&callback=myCallback
), Goodreads sends back the following JSONP data:

myCallback([{
    "id":22571333,
    "isbn":"163058679X",
    "isbn13":"9781630586799",
    "ratings_count":657,
    "reviews_count":2288,
    "text_reviews_count":138,
    "work_ratings_count":835,
    "work_reviews_count":2596,
    "work_text_reviews_count":155,
    "average_rating":"3.93"
}])

Here is the javascript code I am using:

function myCallback(result) {
    document.getElementById('goodreads-rating').innerHTML = result.average_rating;
}

var scriptTag = document.createElement('script');
scriptTag.src = "https://www.goodreads.com/book/review_counts.json?isbns=9781630586799&key=YOUR_KEY&callback=myCallback";
document.getElementsByTagName('head')[0].appendChild(scriptTag);

My goal is to retrieve the average_rating from the data. However, when the HTML renders, all I see is the word "undefined".

I suspect that the issue lies in how I am handling the array/object within the response.

Can anyone offer some insight into what might be going wrong?

Answer №1

This solution resolved my issue:

result[0].average_rating;

I have come to understand that I was attempting to access specific elements within an array, hence the requirement to specify the index number [0]. Much appreciation to @dandavis for providing the helpful response!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Update a product on an admin dashboard for an eCommerce website project using Node.js alongside Express.js, HBS, and MongoDB

Edit Button <td> <a href="/admin/edit-product/{{this._id}}" class="btn btn-primary">edit</a> </td> Routing for the Edit Product Link var ProductHel ...

How come the "colspan" attribute is not functioning properly in my table?

Check out the simple table form I created on jsfiddle. Here is the code snippet: <table> <tr> <td class="field_label">name</td> <td>*</td> <td> <input type="text"> ...

What is the best way to serialize and transmit instances of ActiveRecord between identical Rails applications?

In my current setup, I have multiple worker instances of a Rails application along with a main aggregate. Here is some pseudo pseudo-code to illustrate what I am trying to achieve: posts = Post.all.to_json( :include => { :comments => { :include =&g ...

Enhance Bootstrap typeahead to accommodate multiple values

I have a basic typeahead setup for searching city names. However, upon selecting a city, I also need to retrieve its latitude and longitude in order to send that data to the backend. $('.typeahead').typeahead({ minLength : 3, source : ...

Can a node.js file be exported with a class that includes IPC hooks?

[Node.js v8.10.0] To keep things simple, let's break down this example into three scripts: parent.js, first.js, and second.js parent.js: 'use strict'; const path = require('path'); const {fork} = require('child_process&apo ...

The clear icon in React will only appear when there is a value inputted

Is there a way to implement the clear X icon that only appears when typing in the input field using reactjs, similar to the search input on the Google homepage? Check it out here: https://www.google.com import { XIcon } from '@heroicons/react/solid&ap ...

Having trouble locating the name 'div' when starting a new React project?

After creating a new React application using the command: "npx create-react-app poi-search --template typescript", ESLint prompted me for permission and then displayed several errors. You can view the screenshot here. I am currently using the latest versi ...

Implementation of Material UI Autocomplete feature with options consisting of an array of objects linking to both ID and label properties

Utilizing the Material UI Autocomplete component in my project has been a key feature. Referencing the official documentation, here are the available options: let options = [ { id: "507f191e810c19729de860ea", label: "London" }, { id: "u07f1u1e810c19 ...

Is it possible to validate only the fields that are currently visible using HTML form validation

I need a solution for excluding hidden fields from HTML form validation. My situation involves having two groups of form fields, each with some required attributes. Depending on user selection, one group may be hidden, and those fields should not contribut ...

Is there a way to set the key of a JSON object as the value of one of its items?

Currently, the structure of an object in my .json file is as follows: { "id": 1, "name": "Bulbasaur", "type_1": "Grass", "type_2": "Poison", "primary_color" ...

Looking to transform a list into JSON format using JavaScript?

I have a collection that looks like this: <ol class="BasketballPlayers"> <li id="1">Player: LeBron, TotalPoints: 28753, MVP: true</li> <li id="2">Player: Steph, TotalPoints: 17670, MVP: true< ...

Ways to access array information acquired through JSON format

Struggling with ajax on my webpage, I've encountered an issue with retrieving data from an array in my JSON result using jQuery. Below is the JSON: {"res":{"tname":"my template","process":["software requirement analysis","efrwefgwerg","ergerger","ew ...

The JSONException is indicating that index 5 falls outside the acceptable range of [0..5)

I encountered an issue with my current App development project that utilizes a specific JSON Object. On some days, the app functions perfectly and retrieves data from the JSON Object without any problems. However, on other days, I receive the following err ...

How to eliminate a line in an XML file with PHP

I have been struggling with a seemingly simple task and tried various methods to no avail. I now find myself seeking guidance on how to achieve my goal. My Objective: I am looking to remove a specific element from an XML file. The Current Situation: The ...

jQuery input checkboxes validation conflict

There seems to be a strange issue with my checkboxes in the table where I have built an Invoice calculator. You can view it here. My goal is to have the inputs for Iva or Irpef not calculated in the Total Amount once they are checked. In the linked example ...

jQuery unable to locate elements or update class following AJAX response

My jQuery.on() event functions are working great when bound to specific elements like "a.my-link". However, I have one function that is bound to the document or body and then traverses multiple elements with the same class attribute. Certain lines in this ...

The counter keeps going, thanks to SetInterval!

My counter, which uses setInterval to increase a value, should stop when it reaches a certain number. However, I am encountering an issue where it does not stop. Does anyone have any ideas on how to fix this? Thank you in advance. jQuery( document ).rea ...

Top solution for preventing text selection and image downloading exclusively on mobile devices

My plan is to use the following code to accomplish a specific goal: -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-tap-highlight-color:rgba(0,0,0,0); I& ...

What is the level of support JACKSON offers for Java Generics?

Currently, I am engaged in a project that utilizes the restFul approach and is schema based. In this project, we are utilizing JAXB for XSD to JAVA conversion. Below is the structure of a class used in this project: @XmlAccessorType(XmlAccessType.FIEL ...

Apply a specific class only when the user scrolls within the range of 200px to 300px

Is it possible to dynamically add a class to a div element based on the user's scrolling behavior? For example, I would like to add a class when the user scrolls 200px down the page, and then remove it when they scroll 300px down. Similarly, I want to ...