How can I prevent AJAX request if it's within 5 seconds of the previous request?

Question

I have a comment box which lets a user post comment by pressing enter. It does this using an AJAX (jQuery) request. Is there a nice way to not let the event fire if it's within 5 seconds of the previous comment and show a message? Or should this be handled server side?

You can use setTimeout(). If you want anything more specific you'll have to show us your code and what you have tried. — Jay Blanchard, Feb 11 '13 at 14:01

score 5 · Answer 1 · edited May 23 '17 at 10:32

5

Depending on your use case you could use throttle or debounce:

http://benalman.com/code/projects/jquery-throttle-debounce/examples/debounce/

Or have a look at this post:

https://stackoverflow.com/a/8056049/190596

edited May 23 '17 at 10:32

Community

1
1

answered Feb 11 '13 at 14:01

Stijn Geukens

15,149
7
65
100

1

Or he can also just disable a button for 5 seconds. – dfsq Feb 11 '13 at 14:16
@dfsq that doesn't work if there's no button. Like in my case. – Loolooii Feb 11 '13 at 14:18
1

@Loolooii That's why I put the word `or` in front :) – dfsq Feb 11 '13 at 14:21

score 1 · Accepted Answer · edited Mar 20 '13 at 11:28

This should be definitelly also handled on server, because javascript restrictions can be bypassed. But, the javascript solution can save some traffic and time:

var last_req = 0;
var limit = 5000; //miliseconds
function send_comment() {
  var time = new Date().getTime();
  if(time-last_req<limit)  {
    alert("Wait please");
    return false;
  }
  last_req = time;
  $.get("comment.php", {/*data*/}, function() {});
}

score 1 · Answer 3 · answered Feb 11 '13 at 14:13

This can be done simply with a boolean flag...

// declare this globally at the top of your script
var allowAjax = true;


// this would be in some event handler (on enter keypress, for example)
if (allowAjax) {
    $.ajax({
        ...
        ...
    });
} else {
    // show message saying to wait
}

allowAjax = false;

setTimeout(function() {
    allowAjax = true;
}, 5000);

score 1 · Answer 4 · answered Feb 11 '13 at 14:16

1

I would use this :

if(timerStarted){
    window.clearTimeout(timeout);
}
timerStarted = true;
timeout = window.setTimeout(function(){
    timerStarted = false;
    // ajax call
, 5000}

answered Feb 11 '13 at 14:16

andrei

2,944
2
25
32

score 0 · Answer 5 · answered Feb 11 '13 at 14:03

0

This might help you with what you want to do: http://jeykeu.wordpress.com/2012/03/09/jquery-prevent-multiple-ajax-requests/

You would have to modify it slightly to add a timer and use that to test to see if a new request is possible.

answered Feb 11 '13 at 14:03

jpsnow72

905
1
13
41

How can I prevent AJAX request if it's within 5 seconds of the previous request?

5 Answers5