Not to show a loading image every time div refreshes

Question

Good day all,

I have a loading image that is shown every time a contact form is submitted. I am using jQuery Ajax to submit data to the server and I am using the following code to show the image.

$(document).ajaxStart(function(){
    $("#loading").show();

}).ajaxStop(function(){
    $("#loading").hide();
});

I also have a div (not included in the contact form) that loads data automatically every 3 seconds from the database. Now every 3 seconds, the loading image is shown. That is really annoying for the user.

My question is.. how to make the loading image only to appear when the form is submitted but not when the div refreshes automatically.

Thank you for your time.

Update By using global:false in ajax, fixed my problem... thanks!

Can't you add some code in the data-fetching function to hide the div while fetching? — display-name-is-missing, Feb 12 '14 at 14:57
possible duplicate of [disable ajaxStart() and ajaxStop() for a single request](http://stackoverflow.com/questions/12604722/disable-ajaxstart-and-ajaxstop-for-a-single-request) — Liam, Feb 12 '14 at 15:11

score 0 · Answer 1 · answered Feb 12 '14 at 14:57

0

Perhaps you should move your $("#loading") toggle to your form submission script? Like this:

form.submit(function(e){
    e.preventDefault();
    $("#loading").toggle();
    $.ajax(...).done(function(){
        $("#loading").toggle();
    });
})

answered Feb 12 '14 at 14:57

Eternal1

5,447
3
30
45

Not to show a loading image every time div refreshes

1 Answers1