Call onClick function in setInterval

Question

I have an onClick function which works as expected. Once this function has been triggered once by click, I want to run it periodically using setInterval.

Here is how I have modified the code to attempt this:

    var clickData;
    var isClicked=0;

    function onClick(e) {
      console.log("OnClick called")
      if(isClicked==0){
        clickData = this;
        isClicked = 1;
        console.log(clickData);
      }

      let empID = clickData.options.empID;
      let reqURL = baseurl  + API_KEY + "&MonitoringRef=" + empID;

      $.ajax({
          type: "GET",
          dataType: "jsonp",
          url: reqURL,
          success: success2,

        });

    }

    if(isClicked==1){
      var f = onClick;
      f.paramater1 = clickData;
      setInterval(f, 500); 
    }

    function success2(json2){
      console,log(json2);
      //Do something with json2...
    }

I have modified the calling of the function from setInterval according to one to one of the answers here.

I think the problem here is with passing the parameters to the function. Is there a way of achieving this?

Saadat · Accepted Answer · 2020-10-26T14:53:58.637

The problem was that with creating the interval in the function itself, made an infinite growing interval call and may be that's why it did not work. The work around can be something like this:

You define a function and call it using the setTimeout from onClick:

function onClick(e) {
   // Your onClick function body ...

   // Add this in your onClick function to call the following function that creates the interval
   setTimeout( function() { startInterval(clickData); }, 1);
}

Now, in the startInerval function, you can call onClick; however to prevent to accumulate the intervals, I declare a flag to check and create the interval only once:

var checkFlag = false;
function startInterval(clickData){
   if(checkFlag === false){
      checkFlag = true;
      setInterval(function(){onClick(clickData);}, 500);
   }
}

I forgot to mention in my question. I had tried this, but this does not work. The automatic call on `onClick` is not happenning. — DotPi, Oct 26 '20 at 14:24
I edited the answer. Maybe this work-around solves the problem. — Saadat, Oct 26 '20 at 14:53

score -1 · Answer 2 · answered Oct 26 '20 at 14:16

-1

You can use add a click listener, then remove the click listener after the button is pressed and the interval is set:

const buttonID = document.getElementById("INSERT-ID-OF-YOUR-BUTTON-HERE")

const yourFunction = () => {
    // your code that you want to be called twice per second goes here
    buttonID.removeEventListener("click")
}

buttonID.addEventListener("click", () => {
    setInterval(yourFunction, 500);
});

answered Oct 26 '20 at 14:16

Wilmor

64
5

The element to which the `onClick` listener is attached dies not have an ID. I am adding a lot of buttons programmatically and binding the click operation. So, depending on which button is clicked, the ID changes. I cannot see an object id in `clickData` either. – DotPi Oct 26 '20 at 14:28

Call onClick function in setInterval

2 Answers2