Tell us what’s happening:
Hi camp mentors!
I am learning the syntax with code academy so that I can attempt the projects provided here with more autonomy. I completed javascript on free code camp, had to stop to work on a meme award page, and found out I needed to review the information again in a different context.
I’m learning how to use AJAX. I don’t really understand what it is used for in the real world, but I keep getting undefined on the challenge. However, it’s actually because free code camp is such a positive experience that I am continuing to pursue coding.
A few questions:
What do you use AJAX for in the code below?
why does it keep returning undefined-what am I not typing in in the code
I don’t know if you can use my API key so here is the link to get your own API key:
API key instructions - go to get API key
Your code so far
// Include data for accessing Google APIs
const apiKey = 'I. AIzaSyB2sfWuybVQXFLw3x7YEq1HsIse6YR55Gw';
const url = 'https://www.googleapis.com/urlshortener/v1/url'
const projection = 'FULL';
// Some page elements
const $inputField = $('#input');
const $expandButton = $('#expand');
const $shortenButton = $('#shorten');
const $responseField = $('#responseField');
// AJAX functions
function expandUrl() { const urlToExpand = url + '?key=' + apiKey +
'&shortUrl=' + $inputField.val();
const xhr = new XMLHttpRequest;
xhr.responseType='json';
xhr.onreadystatechange=function(){if (xhr.readyState === XMLHttpRequest.DONE) {
$responseField.append('<p>Your expanded url is: </p><p>' + xhr.response.longUrl + '</p>');
}
}
var motorBike = {
// Only change code below this line.
};
Your browser information:
Your Browser User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) **Chrome/64.0.3282.186** Safari/537.36
.
Link to the challenge: