I am using jQuery and I have some trouble on stopping to work the setInterval
when performing a AJAX request that returns the same code containing the same setInterval
. That is:
Given I have the following code:
<div id="test_css_id">
<a id="link_css_id" href="test_url.html">LINK</a>
<script type="text/javascript">
$('#link_css_id').click(function(event) {
event.preventDefault();
$.ajax({
url: $(this).attr('href'),
type: 'PUT',
success: function(data) {
$('#test_css_id').replaceWith(data); // Replaces all code including JavaScript with the response data (note: the response data is exactly the same as the code shown here).
}
});
});
$(document).ready(function() {
var refreshTimer;
function refreshFunction(){
$.ajax({
url: 'test_url.html',
type: 'GET',
success: function(data) {
$('#test_css_id').replaceWith(data); // Replaces all code including JavaScript with the response data (note: the response data is exactly the same as the code shown here).
},
complete: function(data) {
clearInterval(refreshTimer); // Note: This'd not stop the setInterval.
}
});
}
refreshTimer = setInterval(refreshFunction, 1000); // milliseconds
});
</script>
</div>
When the AJAX request within the click
function runs on success then the above code is reloaded (note: the rendered data
in the replaceWith
is exactly the same as the above code, including JavaScript). However the setInterval
is not "overrode" / "stopped" and so the browser runs one more time that setInterval
for each time I clicked theLINK
. The same does not happen when the refreshFunction
runs. However, depending on the amount of previous click on the LINK
, even the refreshFunction
causes the setInterval
to run more and more.
How can I stop the setInterval
to run when the AJAX request success so to have only one setInterval
running?
You will need to clear the timer right before you perform the replacement. For this, you'll need the timer variable to be accessible within the
click
callback as well. In this case, I have made the timer global, but there are other ways you can do it, I'll leave that up to you.