Ensure that JavaScript functions are executed sequentially without overlapping

Important : Absolutely no jQuery allowed

I have developed four distinct functions and I am looking to execute them sequentially, one after the other in JavaScript without using jQuery. I have scoured the internet for a solution but unfortunately have not found a satisfactory answer. Here is an overview of what I have accomplished so far:

function func1() {
    noAjaxCall.click();
    return true;
}

function func2() {
    ajaxCall.click();           <--------- making an AJAX request
    return true;
}

function func3() {
    noAjaxCall.click();
    return true;
}

function func4() {
    //any code can be inserted here
}

if(func1())
    if(func2())
        if(func3())
            func4();

The issue that I am facing is that func3 does not get called. Can someone help me understand why this occurs and suggest a potential workaround?

Thank you!

Answer №1

It seems like your expectations are not aligning with reality. When func3 is called, the AjaxCall may not be completely finished because it's asynchronous.

I recommend focusing on finding the actual solution to your problem rather than just trying to patch it up temporarily.

Can you provide more insight into the ultimate goal you are aiming to achieve?

edit

Consider handling the 'click' event for ajaxCall. I understand that jQuery may not be available in your application, but here's an example based on my knowledge:

function requester(){
    //do some asynchronous work
    $.ajax({ //...
        success: function() {
            //Invoke other functions here
        }
    });
}

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

What is the best way to layer four images in a 2x2 grid over another image using CSS as the background

I am attempting to place 4 images of the same size on a 5th image defined as the background. Currently, it looks like this: It works perfectly when the height is fixed, but in my case, the height may vary causing this issue: This problem isn't surp ...

Having trouble using Redirect inside a button's onClick function with React Material UI and React Router

I have been attempting to activate the Redirect React Dom using my button component within the handleMenuItemClick() function. Unfortunately, nothing seems to be happening. I've experimented with various methods, but I'm still unable to get it to ...

How come certain jQuery scripts and icons are not functioning properly after the partial view is loaded in ASP.NET Core?

I am encountering an issue on my page where I have a list of information that can be searched using fields and Ajax. When I reload the information as a partial view, none of the jQuery code seems to work after the reload. What could be causing this problem ...

What is the process of invoking a Java method through AJAX on a website?

I am trying to figure out how to call the Java method getMessage() from a jar file whenever a button on my webpage is clicked. Can anyone help me achieve this? File name: index.html <!doctype html> <html> <head> <meta charset="utf-8" ...

Is there a way to utilize OpenLayers to showcase various icons for distinct features all within one layer?

Being new to Openlayers/JS and fairly inexperienced with programming in general, there may be other issues in my code that I'm unaware of. I am currently using the latest version of Openlayers (5.3.0). My application sends GeoJson formatted data via ...

The variable that contains a function is invoked, but the result is undefined

I'm having trouble with a function that should return John temp (2021) when called, but instead it's returning John undefined (undefined) const user = { username : 'John', type: 'temp', yearJoin: 2021, user ...

Obtain data with matching JSON values in a REACT application

Recently, I received a JSON file that looks something like this: [ { "symbol": "A", "name": "Agilent Technologies Inc", "exchange": "NYSE", }, { "symbol": "AAC ...

Firebase: Saving data to a nonexistent object

I am currently facing a challenge in saving the result of a serviceId to a services object within a parent entity named provider1, especially since the services object has not been initialized yet. The structure of my Firebase data is as follows: "provid ...

Executing a Load Test with JMeter: Testing the Login, AJAX Interaction, Item Selection, and Purchase Process

Looking for assistance on how to set up a JMeter test that involves logging into a website, initiating an AJAX search, displaying results, and selecting one of the results. I have configured 4 HTTP requests - a GET request for the login page, a POST requ ...

ways to dynamically retrieve input values in PHP

Is there a way to dynamically add and remove data fields, as well as increase and decrease fields dynamically in PHP? I am looking to retrieve the subject value in an array or JSON format using PHP only. https://i.stack.imgur.com/HqDCz.png <div data-ro ...

Struggling to find a solution to adjust an Angular directive

I am attempting to create a functionality where, upon clicking a button, the user can select one of two images displayed and make the selected image draggable. Currently, my code displays two images with only one being draggable. I am struggling to impleme ...

Subscriber client successfully activated and operational via the command line interface

I have incorporated a script into my PHP file that reads the Pusher channel and performs various actions when a new event occurs on the specified channel. If I access the following URL in my browser: http:/localhost/pusher.php and keep it open, the p ...

When Vue 3 is paired with Vite, it may result in a blank page being rendered if the

Issue with Rendering Counter in Vite Project After setting up a new project using Vite on an Arch-based operating system, I encountered a problem when attempting to create the simple counter from the Vue documentation. The element does not render as expec ...

Is the window frozen while Ajax processes the request?

When I make an ajax request that may take a significant amount of time to process on the server-side, I want to display a loading image during the request. However, the loading image is not showing up while the ajax request is processing. var ref = create ...

Is there a way to initiate an AJAX post request with the Authorization header for the initial request using Windows Authentication?

I'm working on a web application that has a video page and a Web API for logging purposes. The events are triggered using an ajax post request: function logAction(actionToLog) { $.ajax({ type: 'POST', url: "/api/v/" + cu ...

Accessing values from a JSON object in AngularJS without using a loop based on another field

Is there a way to extract the "value" associated with the "name" in JSON using Angular JS without having to iterate through the array? For instance, if I have an array like the one below with name and value fields, how can I retrieve the value "ABC" based ...

Encountering an Internal Server error with Mongoose in Node.js

My latest project is a web application designed for photo sharing. One particular route in the app is responsible for retrieving and displaying photos from all users in the following array. This is the route: router.get('/getphotos',function(r ...

Retrieving information from an API and presenting it as a name with a link to the website

I am attempting to retrieve information from an API and present it in the format Name + clickable website link. Although I have managed to display the data, the link appears as text instead of a hyperlink. Here is my Ajax script: $(function() { ...

The list attribute in AngularJS seems to be malfunctioning when used in Internet Explorer 11

My current issue involves using the 'find' method within a scope. While it works perfectly fine in Chrome, there seems to be compatibility issues with Internet Explorer 11. How can I resolve this and make it work smoothly on IE 11? $scope.NameLi ...

The layout option is not specified within the ejs-mate package

error boilerplate I am baffled as to why the layout is not being defined. I have installed ejs-mate and ejs, yet it still gives this error. <% layout('layouts/boilerplate') %> <h1>All campgrounds </h1> <div> <a ...