Reputation:
I have the following Javascript function called Howto that is executed when a button is pressed:
function howto(){
$('#elementtoupdate').ajaxSend(function() {
//Code to execute
});
$('#elementtoupdate').ajaxComplete(function() {
//Code to execute
});
$('#elementtoupdate').load('serverside/file_path.php')
}
Using JQuery the function assigns two JQuery Global Ajax Event Handlers, they are initiated when the any AJAX calls are initiated. Then the function continue and calls a JQuery .load
function, and any code inside the Global Ajax Event Handlers is initiated.
However, as the name the word Global suggests they are also initiated by other Jquery AJAX calls. This unfortunately is undesirable as I have other AJAX calls in the script. I need the code to be executed only when $('#elementtoupdate').load('serverside/file_path.php')
is executed.
What is the best way of doing this?
Upvotes: 1
Views: 73
Reputation: 52236
You should accept David Hedlund's answer. For the sake of completeness :
you can change :
function howto(){
$('#elementtoupdate').ajaxSend(function() {
//code to be executed before send
});
$('#elementtoupdate').ajaxComplete(function() {
//code to be executed after completed
});
$('#elementtoupdate').load('serverside/file_path.php')
}
to :
function howto(){
//code to be executed before send
$('#elementtoupdate').load('serverside/file_path.php', function(){
//code to be executed after completed
})
}
Upvotes: 0
Reputation: 129832
load
has callbacks on its own that are not global:
.load( url [, data ] [, complete(responseText, textStatus, XMLHttpRequest) ] )
Thus:
$('#elementtoupdate').load('serverside/file_path.php', function() {
// complete
});
Upvotes: 4