Menu
Hello friends i want to show Ajax loader before Data load in particular div but problem is the data is coming dynamically on same page but my script calling data from another file Script.php please see my code below
Script
<script>
function loadingAjax(div_id)
{
$("#"+div_id).html('<img src="ajax-loader.gif"> saving...');
$.ajax({
type: "POST",
url: "script.php",
data: "name=John&id=28",
success: function(msg){
$("#"+div_id).html(msg);
}
});
}
</script>
HTML
<body onload="loadingAjax('myDiv');">
<div id="myDiv"></div>
<div id="xyz"><img src="ss/image/abc.jpg" /></div>
</body>
Its working fine but i want to load data in same page please help me
Thanks in advance ....
EDIT
I want to show loader before load data #xyz into #myDiv
497
Answer: Use the ajaxStart() and ajaxStop() MethodWhile working with Ajax, showing a loading spinner or displaying a message with some animation like "Loading... Please Wait" is popular way to indicate the user that Ajax request is in progress.
To display loader on ajax call use beforeSend and complete events.
The jQuery load() method is a simple, but powerful AJAX method. The load() method loads data from a server and puts the returned data into the selected element. Syntax: $(selector).load(URL,data,callback);
ajax() function with the default settings, any JavaScript code after this AJAX request will be executed without waiting for a response. In most cases, this is the desired behavior, but there are some situations where you will want to prevent further execution until there has been a response to the AJAX call.
you can try with following html -
<body onload="loadingAjax('myDiv');">
<div id="myDiv">
<img id="loading-image" src="ajax-loader.gif" style="display:none;"/>
</div>
</body>
and the script -
<script>
function loadingAjax(div_id) {
var divIdHtml = $("#"+div_id).html();
$.ajax({
type: "POST",
url: "script.php",
data: "name=John&id=28",
beforeSend: function() {
$("#loading-image").show();
},
success: function(msg) {
$("#"+div_id).html(divIdHtml + msg);
$("#loading-image").hide();
}
});
}
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
