AJAX request confusion

Question

Figure i am talking about-: https://imgur.com/a/T4viIKF   Confusions, 'ie' means my interpretation that i am not sure if is correct or not)-: 1) user clicks invoking an event handler.   i.e when an user event occurs, it makes a javascript call. most likely user event=function call 2) handler's code creates xmlhttprequest object   i.e that javascript call creates xmlhttprequest in ajax engine. 3) xhr requests file from server 4) server sends the file. 5) NOW I AM CONFUSED. the terminologies are confusing me.  like-:  a) xhr fires an event. what does that mean? and why to fire an event? Doesn&rsquo;t user only fire event? Like clicking,pressing some key etc. b) you can attach handler function to event. (maybe it is trying to talk about event handler i.e if event->handlerfunction() )..I am not sure.   handler fxn then processes the data and displays it.

vikas_jk · Accepted Answer

Hello, Checked your image.

You have understood it correctly, event is fired by user, by mouse click, keyboard click etc

This will invoke handler (now handler here means method)

for example:

$(".btn").click(function(){   //this function is event handler    //when button with class ".btn" is clicked by user    })

So in pure Javascript.

document.getElementById('btn').onclick = function () {  //when button is clicked // event fired     var xhr = new XMLHttpRequest(); // xhr request created     xhr.open('GET', 'ajax/content.html', true); //requeest page from server     xhr.responseType = 'text';     xhr.onload = function(e) {      //.onload is another event      //this function handles that event       //if request status =200, means success       if (this.status == 200) {            //execute this code.             document.getElementById('localContentHere').innerHTML = this.response;         }     };     xhr.send(); //request is sent here }

That's it.

AJAX request confusion

Related Articles

Subscribe Now

Related Questions