Ajax Question
Multiple clicks prevents AJAX requests
I have page with multiple buttons, which sometimes can be clicked really fast - however it seems like Chrome can hold up with the speed?
$(document).ready(function() {
$('.favorite-button').unbind('click').click(function() {
addLine($(this).data('line-id'));
});
});
addLine() function:
function addLine(lineID) {
$.ajax({
type: 'POST',
url: 'add-line.php',
data: { lineID : lineID },
success: function(server_response) {
$('#counter-lines').html(server_response);
}
});
}
What can I do so that Chrome will register and complete every ajax call?
It does not seem to be a limit in Chrome - even two fast clicks will result in a missing ajax call...
Answer
It seems that you just don't get the responses by order.
I see that you tell the server what ID to give the line. So why don't you keep the sent lineID in a global variable, and when you get the response you can see if it's a response to the most recent request.
like:
var latest_line = null;
function addLine(lineID) {
latest_line = lineID;
$.ajax({
type: 'POST',
url: 'add-line.php',
data: { lineID : lineID },
success: function(server_response) {
// Is this the most recent request?
if (latest_line == lineID)
{
$('#counter-lines').html(server_response);
}
}
});
}
Source (Stackoverflow)