Pull data from Bandsintown API

Question

I need a little help on pulling events data from the Bandsintown API. I tested the HTTP GET request in the Postman App and it returns data correctly.

Now I am trying to pull this data into a JavaScript to then render it on a website that I design, but it seems that something does not work. Here's my code:

var eventRequest = new XMLHttpRequest();
eventRequest.open('GET', 'https://rest.bandsintown.com/artists/${artistname}/events?date=upcoming&app_id=${app_id}');
eventRequest.onload = function() {
  var eventsData = eventRequest.responseText;
};
eventRequest.send();

To render the data further down in the JS I am using:

document.getElementById("app").innerHTML = `
   ${eventsData.map(eventTemplate).join("")}
`;

chances are, that eventsData hasn't been populated by the **asynchronous** callback in onload ... rather than having that code "further down", put it **inside** the onload callback, where the data **is available** ... note `var eventsData` inside the `onload` callback certainly won't be available anywhere except in that function where it is declared - that's how variables work — Jaromanda X, Aug 27 '20 at 07:06
Does this answer your question? [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — CBroe, Aug 27 '20 at 07:15

score -1 · Answer 1 · answered Aug 27 '20 at 07:11

you can try this and in log might see further error.

var eventRequest = new XMLHttpRequest();

eventRequest.open("GET", "https://rest.bandsintown.com/artists/${artistname}/events?date=upcoming&app_id=${app_id}", true);

eventRequest.onreadystatechange = function (event) {  
    if (eventRequest.readyState === 4) {  
        if (eventRequest.status === 200) {  
          console.log(eventRequest.responseText)  
        } else {  
           console.log("Error", eventRequest.statusText);  
        }  
    }  
}; 

eventRequest.send(null);

Thibault Husté · Answer 2 · 2020-08-27T07:36:27.563

-1

Also, I'm pretty sure that if you want to use string literals in your url (${artistname}) you will need back quote (``) instead of simple or double-quotes.

'https://rest.bandsintown.com/artists/${artistname}/events?date=upcoming&app_id=${app_id}'

to

`https://rest.bandsintown.com/artists/${artistname}/events?date=upcoming&app_id=${app_id}`

edited Aug 27 '20 at 07:36

answered Aug 27 '20 at 07:15

Thibault Husté

136
10

Pull data from Bandsintown API

2 Answers2