Jump to content

Reload Div in a function


slj90

Recommended Posts

I have a div that displays the contents of a mysql table. When the users adds to the table/presses a button I want it to fade out, reload, and fade back in with the new content there.


The current PHP code is in its own div called 'stream'...
 

<script>

function buttonFunction() {

 v=$("#txtstatus");
  $.post('../action/poststatus.php',{status:v.val()},function(d){
 $('div#stream').fadeOut('slow');
 $('div#stream').load;
 $('div#stream').fadeIn('slow');

  });

}

</script>

This fades out and back in but with nothing new loaded.

 

Please help.

Thanks,

 

Link to comment
Share on other sites

I have now got it working:

$('div#stream').fadeOut('slow');
$("#stream").load(location.href + " #stream");
 $('div#stream').fadeIn('slow');

However, it only shows up the second time you press the button because it's too fast. How can I slow it down and perhaps show a loading message/image?

Thanks

Link to comment
Share on other sites

I have now got it working:

$('div#stream').fadeOut('slow');
$("#stream").load(location.href + " #stream");
 $('div#stream').fadeIn('slow');

However, it only shows up the second time you press the button because it's too fast. How can I slow it down and perhaps show a loading message/image?

 

Thanks

 

You should use callbacks on those three jQuery functions. Right now they're all executed at the same time, which may cause the effect you mentioned.

 

 

var selector = 'div#stream';
$(selector).fadeOut('slow', function() {
$(selector).load(location.href + ' #stream', function() {
$(selector).fadeIn('slow');
));
});

 

Obviously that coding style isn't good practise, but it's to make it as simple as possible. Generally you would want to keep your callbacks as external functions and just reference them as the callback function.

 

In any case, this means it will:

- Fadeout

- Load when Fadeout is complete

- Fadein when Load is complete

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.