Question

How can I show and hide a loding.gif image when using the code below? That’s all the code there is. There’s no beforeSend: or success: here.

$("#seg").change(function(){
$("#sSeg").load("/blah/blah.php?option="+$("#seg").val());
});

What happens here is, when a drop downs value changes it’ll fetch new content for another drop down list. I wanted to add a loading.gif there so the user knows things are working.

Answer 1

Just create a div like this where you want to show the loading image and put a loading image inside it and set it’s display as none by default and show it using jQuery.

<div id=”loading”><img src=”loading.gif”></div>

$("#seg").change(function(){
    $("#loading").css("display","block");
    $("#sSeg").load("/blah/blah.php?option="+$("#seg").val(),function(){ 
       $("#loading").css("display","none");
    });
});