Receiving feedback from an Ajax request

When attempting to retrieve the responseText from an AJAX call created in plain JavaScript, there seems to be an issue where Firebug can detect the request but cannot obtain a reference to the responseText.

Below is the code for the function:

function getAjaxResponse(){    
    var ajaxObj = getAjaxObj();
    ajaxObj.open('get', 'responsePage.php', true);
    ajaxObj.onReadyStateChanged = function(){
        if(ajaxObj.readyState == 4
            && ajaxObj.status == 200){
                //no functions are getting executed here                
                //this does not show up in console
                console.log(ajaxObj.responseText);
                //neither does this
                console.log(2);
        }
    };
    ajaxObj.send(null);

   //this gets displayed in the console
   console.log(1);
}

Function for the AJAX object:

function getAjaxObj(){
    var req;  
    if(window.XMLHttpRequest){
        try{
            req = new XMLHttpRequest();                                                                 
        } catch(e){
            req = false;
        } finally {
            return req;
        }
    } else {
        if(window.ActiveXObject){
            try{
                req = new ActiveXObject("Msxml2.XMLHTTP");
            } catch(e){
                try{
                    req = new ActiveXObject("Msxml.XMLHTTP");
                } catch(e){
                    req = false;
                } finally {
                    return req;
            }
            }
        }
    }
}

Also attached is the view from Firebug:

How can one access the response from the AJAX call?

Answer №1

onReadyStateChanged should actually be written as onreadystatechange. Remember, JavaScript is case-sensitive.

Answer №2

ajaxObj.onReadyStateChanged: For consistency, it is recommended to use all lowercase letters and remove the trailing 'd' in onreadystatechange.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Creating a sliding menu using React and Headless UI (with Tailwind CSS)

Currently, I'm in the process of developing a slide-over navigation bar or slide menu that features panels opening on top of each other (I'm still searching for the most accurate way to describe it). The main concept revolves around having a sli ...

Failure to trigger Summernote's OnImageUpload function

After transitioning to the latest version of Summernote, which is Version 7, I encountered a problem with the image upload functionality. Despite specifying the line onImageUpload: function(files) {sendFile(files[0]);}, it seems that this code is not being ...

Refreshing Angular Page

I'm looking for a way to reset my Angular page back to its original state with just one button click. I attempted to use the angular.copy method, but encountered an error. I have various scope and controller variables that I don't want to reset i ...

Is React Context suitable for use with containers too?

React provides an explanation for the use of Context feature Context in React allows data sharing that can be seen as "global" within a tree of components, like the authenticated user, theme, or language preference. Although this concept works well for ...

Tips for showcasing overflowing text in a menu list by rotating the item text

Imagine you have a TextMenuItem component, using MenuItem from the Material-UI library, that is part of a chain consisting of DropDownSearch > SimpleListMenu > FixedSizeList > TextMenuItem. In simple terms, this creates a searchable dropdown element with t ...

Turning an array of strings into a multidimensional array

I have a JavaScript string array that I need to convert into a multidimensional array: const names = [ "local://john/doe/blog", "local://jane/smith/portfolio", "as://alexander/wong/resume" ]; The desired output sh ...

Limit the implementation of Angular Material's MomentDateAdapter to strictly within the confines of individual

Within my app, I have several components that utilize the mat-datepicker. However, there is one component where I specifically want to use the MomentDateAdapter. The issue arises when I provide it in this one component as it ends up affecting all the other ...

What is the process for adding submitted data to an already-existing local JSON file?

I have a new Angular assignment that requires me to push form data into an existing JSON file locally. The task is to develop an Angular application where users can create new tasks and view them on a separate page. Initially, I attempted using http.post ...

What is a reliable method to retrieve the text from the current LI if all LI elements in the list share the

I'm encountering an issue with retrieving the text from LI elements because I have 10 list items and they all have the same class name. When I attempt to fetch the text using the class name or id, I only get the text of the last item. Here is my code ...

Creating an Angular table using reactive forms: a step-by-step guide

After reviewing the HTML snippet provided below, it is evident that there is a table with looping through mat cell using *matCellDef="let model". Inside each cell, there are input fields which are reactive forms. Each row or cell needs to have it ...

Guide on how to trigger the opening of a side panel with a button click in Vue.js

Embarking on my first Vue app development journey, I find myself in need of guidance on how to trigger the opening of a panel by clicking a button within the header. Starting off with a simple HTML template, my goal is to add some interactivity upon click ...

"An error occurs when trying to trigger a .click() event within a list element

There is a list that can contain either plain text or a link. If there is a link present, the entire list element should be clickable. When attempting to execute the following code: if ($('.link').length) { $('li[data-contains-link]' ...

Attempting to assign a thumbnail image to a file on Google Drive by utilizing JavaScript

I've been working on adding thumbnails to the files that I upload to Google Drive using Javascript. I'm following the instructions outlined at https://developers.google.com/drive/v3/web/file#uploading_thumbnails For my web-safe base64 image, I c ...

Is there a way to ensure that GIFs in jQuery Mobile always start from the beginning?

My cross-platform mobile app built with jQuery Mobile is a small quiz application. After each correct or wrong answer, I display a 3-second GIF. Currently, I have set up the code to show the GIF for 3 seconds before moving on to the next page: else if ($. ...

What is the best way to access data from this $scope in AngularJS?

Upon printing selecteditems to the console, this is the output: [{"model":"Lumia","brand":"Nokia","subModel":["Lumia 735 TS","Lumia 510"],"city":"Bangalore"}] I have stored it in $scope.details as follows: var selecteditems = $location.search().items ...

The lightbox feature on the page is not functioning properly

On my website, I have a beautiful lightbox created using fancybox.net. You can check it out here: I also use gallery codes to display images in a gallery format. Below is the jQuery code I am using: $(document).ready(function() { $(".gallery").fancy ...

What could be causing axios to not function properly when used with async/await in this particular scenario

I need to update the DoorState when a button is clicked. After sending a request to the API to change the DoorState, I then call another API to check the status of the robot. Even though the DoorState has been successfully changed, it seems that the chan ...

Utilizing JavaScript to Retrieve Selected Parameter in SSRS Report

Currently, I am incorporating an SSRS report into my website using Iframe. I aim to share a link to the specific filtered report, which is why I require knowledge of the report's parameters. My query pertains to how I can identify these parameters (e ...

How can I assign the items in a list as keys to an object in redux?

I am currently utilizing Redux in combination with Reactjs. The Redux Documentation states: It's recommended to return new state objects instead of mutating the existing state. My current object's state looks like this: state = [..., {id: 6 ...

When I click on .toggle-menu, I want the data-target to have a toggled class and the other divs to expand

Looking to achieve a functionality where clicking on .toggle-menu will toggle a class on the specified data-target element and expand other divs accordingly. jQuery(document).ready(function() { var windowWidth = jQuery(window).width(); if (win ...