CODEWITHSUNDEEP
javascriptphpjqueryhtmlajax
Jazuly
Jazuly

Reputation: 321

how to refresh a specific div content with fade in & fade out

how to refresh a specific div content with fade in & fade out, im create like this. when i click button nothing happening.
javascript

$('#btn_click').click(function(){
  $('#postinganrefresh').fadeIn(1000);
  setTimeout(function(){
    $('#postinganrefresh').fadeOut(1000, function(){
      location.reload(true);
    });
  });
});

button click

<a style="float: right;" class="btn btn-default" id="btn_click">
  <i class="fa fa-refresh"></i> Refresh
</a>

specific div to refresh

<div class="container" id="postinganrefresh">
  mycontent table
</div>

Upvotes: 1

Views: 1710

Answers (2)

kendepelchin
kendepelchin

Reputation: 2974

You're using the jQuery API (http://api.jquery.com/fadein/) but you should include jQuery. 

<script src="http://code.jquery.com/jquery-latest.min.js"
    type="text/javascript"></script>

See this fiddle: https://jsfiddle.net/6nuopwau/

Upvotes: 1

Richard
Richard

Reputation: 628

With your location.reload(true); you reload the hole page.

You gave your setTimeout( not time to set off. Write it so setTimeout(function(){ ... },2000);

If you want to reload only the div content, than take a look at the jQuery function $.ajax. Like:

$('#postinganrefresh').fadeOut(1000, function(){
 var t=$(this);
 $.ajax({type:"POST",url:window.location.href, data:{'somePostData':'andTheValue','post2':'value2' }}).always(function(e){
  t.html(e);
 });
});

Upvotes: 0

Related Questions