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 anothe
you can try with following script
<script>
function ajax()
{
var options = {};
options.url = '';
options.type = 'post';
options.data = '';
options.dataType = 'JSON'; // type data get from sever
options.contentType = 'application/json';// type data post to sever
options.async = false;
options.beforeSend = function () {
};
options.success = function (data)
{
};
options.error = function (xhr, status, err) {
console.log(xhr.responseText);
};
$.ajax(options);
}
</script>
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>