javascript - how to show loding image while ajax call -

javascript - how to show loding image while ajax call -

i need show loading image while ajaz called.... did work on this.... not helpful ...it not showing loading image.... , want block screen when image loading... ajax here below...

----ajax--- function checkemail(value_email_mobile) { // before request, show gif //$('#loader').show(); if (value_email_mobile !== '') { //alert('te'); $.ajax({ type: "post", url: url_check_user_avail_status, data: "value_email_mobile="+value_email_mobile, success: function(msg) { //alert(msg); //$('#psid').html("<img src='images/spacer.gif'>"); $('#loader').hide(); $('#validation').html(msg); // //$('#sid').sselect({ddmaxheight: '300px'}); }, error: function() { //alert('some error has occured...'); }, start: function() { //alert('ajax has been started...'); $("#loader").show(); } }); } } ------html-- <div id="loader" style="display:none;"><img src="<wait.png" ></div>

for 1 thing, image tag invalid <img src="<wait.png" > should <img src="wait.png"/>

as loader, $.ajax has alternative called beforesend. can utilize so:

$.ajax({ type: "post", url: url_check_user_avail_status, data: "value_email_mobile="+value_email_mobile, beforesend: function () { $("#loader").show(); }, success: function(msg) { // success code here $("#loader").hide(); });

javascript jquery html css ajax