AJAX request confusion


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-:

  1. a) xhr fires an event. what does that mean? and why to fire an event? Doesn’t user only fire event? Like clicking,pressing some key etc.
  2. 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.


Asked by:- shivajikobardan
0
: 94 At:- 6/9/2022 12:13:04 PM
ajax web







1 Answers
profileImage Answered by:- vikas_jk

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.

 

1
At:- 6/9/2022 12:31:19 PM
that's great thanks for information. it is really valuable. 1
By : shivajikobardan - at :- 6/10/2022 4:10:21 AM






Login/Register to answer
Or
Register directly by posting answer/details

Full Name *

Email *




By posting your answer you agree on privacy policy & terms of use