AJAX Response

Quick reference

• 00:05 We talked about making AJAX requests with get and post in the last video, but
• 00:08 there's still a little bit of code here in the example that we don't quite
• 00:11 understand, and that's what I want to talk about in this video.
• 00:14 So we're talking about AJAX responses.
• 00:17 And let's look at our example code again here.
• 00:19 This is the bit of information that we're not quite sure of, and we have this on
• 00:23 ready state change and this ready state, this line here we already understand.
• 00:28 We're just getting our element by ID.
• 00:30 Calling it ajax up here.
• 00:32 That's our ID right there.
• 00:33 And we're saying whatever response we get,
• 00:35 this response text, slap it into the innerHTML.
• 00:39 So, we understand that line,
• 00:40 it's these two right here that are kinda weird looking, right?
• 00:43 Well, here at the beginning, we created this XML request.
• 00:48 We're requesting something from from a server,
• 00:50 readyState holds the status of that request, and
• 00:53 onreadystatechange defines what we'll do whenever our readyState changes.
• 00:58 So, this'll make sense in just a second here.
• 01:00 I'm gonna copy some information and I'm just gonna paste this on here and
• 01:03 I'll put these in the resource files.
• 01:05 Here we see this readyState.
• 01:06 It's equal to 4.
• 01:08 Right, what is that?
• 01:09 We have these codes here.
• 01:11 These are ready state codes, and there is five of them: zero, one, two, three,
• 01:14 and four, and zero means our request has not been started yet.
• 01:19 We haven't done anything with it yet.
• 01:20 Number one is the server has, we have established a connection with the server.
• 01:24 The second one is the request has been received.
• 01:27 The third one is it's processing, and the fourth one means everything's finished.
• 01:31 So what we're saying here is whenever the state of our call to the server is at 4,
• 01:36 whenever our request has finished, and the status code equals 200,
• 01:40 then do this thing.
• 01:42 So what is this status code thing?
• 01:44 Well, this is an http server message and
• 01:47 200 means okay, 403 means forbidden, 404 means page not found.
• 01:51 You know, if you've gone to a webpage and you got an error message and it says,
• 01:56 you know, 404 page not found, that's an HTTP request message thing.
• 02:02 Here, 200 means okay, good job, everything's fine.
• 02:05 So when we get this 4, meaning our request if finished, and
• 02:09 it came back saying hey everything's okay, then we can print this out.
• 02:13 So I'll put these guys in the resource file so
• 02:16 you can print them out or save them or make a note of them or
• 02:19 whatever, but basically this is very simple when we break it down.
• 02:22 So to look at this again, remember this double and,
• 02:25 our logic operators from way back at the beginning of the course?
• 02:28 It is saying this has to be true and this has to be true in order for this
• 02:32 to happen, and you'll notice there's no else statement, it's just an if statement.
• 02:36 I said way back in the beginning of the course,
• 02:38 you're never gonna see just an if statement on its own.
• 02:40 Well, here we go, just an if statement on its own.
• 02:42 So there's definitely times when you're just gonna wanna use an if statement, and
• 02:46 not an if, else statement.
• 02:47 So anyway, that's AJAX's responses, very easy.
• 02:50 We create our request, we wait for a change on that request, open and
• 02:54 send data, and then we get our data back.
• 02:57 Pretty simple, but like I said earlier, this all happens in the background.
• 03:00 Our page doesn't have to be reloaded whenever we use AJAX and
• 03:04 that's just really, really cool.
• 03:05 I mean AJAX is just one of those awesome things.
• 03:08 You see it wasn't really that hard.
• 03:09 I mean, this kinda looks complicated, but once we broke it down, it's not that hard.
• 03:14 It's pretty simple.
• 03:15 So, in the next video we'll start the last section of the course.
• 03:17 We're gonna put everything together.
• 03:19 We're gonna build a math flash card app, which should be a lot of fun.
• 03:22 And that's all for this video.

Lesson notes are only available for subscribers.