How to set a timeout on foreach in ajax?

Question

0.00/5 (No votes)

See more:

I want to call this function every 5 seconds. But I get error setTimeout is not a function

What I have tried:

    $(document).ready(function () {
         started = true;
         var total = line.length;

         line.forEach(setTimeout(function(value) {
         var ajaxCall = $.ajax({
         url: url,
         type: 'GET',
         data: some data,

    success: function(data) {
    //some codes here

        doneCheck();
}

            });
            $('#stop').click(function () {
                ajaxCall.abort();
                $('#start').attr('disabled', null);
                $('#stop').attr('disabled', 'disabled');

            });
        }, 5000)); // 5 seconds timeout
  });

Posted 12-Jul-22 18:35pm

Member 15704855

Updated 13-Jul-22 0:20am

Add a Solution

3 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Chris Copeland · Answer 1 · 2022-07-13T00:03:00

The easiest solution would be to have the timeout registered as part of each ajax request. The problem you're having is that you're calling setTimeout() within the forEach method directly which isn't a valid process. Consider something like the below:

var running = true;

function update(value)
{
  // If the variable has been set to anything but true
  // then we know the updates have been cancelled
  if (!running)
    return;

  $.ajax({
    url: url,
    type: 'GET',
    data: data,

    // The success function here is called only when the
    // request was successful
    success: (data) => {
      // Do some work here
    },

    // The complete function here is called even if the
    // request failed, guaranteeing that the timeout will
    // be set to run again
    complete: () => {
      setTimeout(() => update(value), 5000);
    }
  });
}

$(document).ready(function()
{
  // Call the update function direct against each line,
  // passing the value into the method
  line.forEach(update);
});

You can then stop the updates by setting the running variable to false (and you could alternatively track and cancel the timeouts, but for simplicity sake I haven't included that). To start the updates again you can simply set the running variable to true and loop over the lines again to call the update() function.

Richard Deeming · Answer 2 · 2022-07-13T00:20:00

lines.forEach expects to be passed a function which will be called for every item in the lines collection.

You are passing in the value returned from the setTimeout function, which is an integer. This cannot be used as a callback function parameter.

Your question says you want to call a function every five seconds. But setTimeout will only call a function once, after the specified delay.

I suspect you want something more like this:

JavaScript

$(function(){
    started = true;
    
    const interval = 5000; // 5 seconds
    let abortController = new AbortController();
    
    const checkLine = function(value){
        const ajaxCall = $.ajax({
            url: url,
            type: "GET",
            data: someData,
            success: function(data){
                abortController.signal.throwIfAborted();
                // some codes here
                doneCheck();
                setTimeout(function() { checkLine(value) }, interval);
            }
        });
        
        abortController.signal.addEventListener("abort", function(){
            ajaxCall.abort();
        });
    };
    
    const total = line.length;
    line.forEach(checkLine);
    
    $("#stop").click(function(){
        abortController.abort();
        $("#start").property("disabled", false);
        $("#stop").property("disabled", true);
    });
    
    $("#start").click(function(){
        abortController = new AbortController();
        $("#start").property("disabled", true);
        $("#stop").property("disabled", false);
        line.forEach(checkLine);
    });
});

Mrunali Madarkar · Answer 3 · 2022-07-12T20:05:00

Solution 1

add a index and set it's value and increment the index value in the loop. Also use async:false.

Posted 12-Jul-22 20:05pm

Mrunali Madarkar

Comments

Richard Deeming 13-Jul-22 6:05am

Synchronous XHR has been deprecated since 2014:
Synchronous and asynchronous requests - Web APIs | MDN[^]

How to set a timeout on foreach in ajax?

3 solutions

Solution 2

Solution 3

Solution 1

Add your solution here

Preview 0