CODEWITHSUNDEEP
jqueryajax
masih arastooyi
masih arastooyi

Reputation: 545

how hide loading image when load jquery done

i have this jquery code 

else if ($(this).val() === "5") {
        var codefaqs = $(this).val();
        $('#imgloadfaqs').show();
        $("#faqsmain").attr("disabled", "disabled");
        $('#faqsanswer').load('http://royta.org/somefolder/get.php',{codedgive:codefaqs},function(applycode){
            $('#faqsanswer').html(applycode);
            $('#imgloadfaqs').hide(2000);
            $("#faqsmain").removeAttr("disabled");
        });
    }

and show loading image and disable select box
i want when get.php do its work and done to send resault
loading image gone
but with this code its gone very soon before php show resault
can anyone help me with this?

Upvotes: 0

Views: 426

Answers (3)

Haresh Ambaliya
Haresh Ambaliya

Reputation: 711

Use following code snippet to show and hide.

    $(document).ready(function() {



// Setup the ajax indicator

$('body').append('<div id="ajaxBusy"><p><img src="images/loading.gif"></p></div>');



$('#ajaxBusy').css({

display:"none",

margin:"0px",

paddingLeft:"0px",

paddingRight:"0px",

paddingTop:"0px",

paddingBottom:"0px",

position:"absolute",

right:"3px",

top:"3px",

width:"auto"

});

});



// Ajax activity indicator bound to ajax start/stop document events

$(document).ajaxStart(function(){

$('#ajaxBusy').show();

}).ajaxStop(function(){

$('#ajaxBusy').hide();

});

To read more about the same follow http://skfox.com/2008/04/28/jquery-example-ajax-activity-indicator/

if you use this approach on all ajax request you will get spinning image, so you do not need to code for all request and it will lead to save extra efforts.

For working example follow jsfiddle link http://jsfiddle.net/re57j/

Upvotes: 1

Dharman
Dharman

Reputation: 33238

try putting the code that hides the image inside the done function. I believe this would be the right approach:

$('#faqsanswer').load('http://royta.org/module/faqs/get.php',{codedgive:codefaqs},function(applycode){
        $('#faqsanswer').html(applycode);
        $("#faqsmain").removeAttr("disabled");
        $('#imgloadfaqs').hide(500);
    });

Upvotes: 2

ρяσѕρєя K
ρяσѕρєя K

Reputation: 132982

move hide method inside function where you are getting result from php file as :

...,codedgive:codefaqs},function(applycode){
            $('#faqsanswer').html(applycode);
            $("#faqsmain").removeAttr("disabled");
            $('#imgloadfaqs').hide(500);
        });

Upvotes: 2

Related Questions