Ercan
Ercan

Reputation: 2773

How to use .load() for refresh div in same page?

I am trying to make an on-line user content which refresh it self and calls every time php function.

I used

<div class="onlineFriends">
 <?php 
$members = find_online_friends($_SESSION['id']);

 foreach($members as $member):?>
<div class="user" href=<?php echo ($member['f_id']);   ?> rel="popup_name" > 

<img src=<?php 
 $avatars = find_avatar($member['f_id']);
 foreach($avatars as $avatar)

 echo ($avatar['src']) ?> 
 />
</div>
<?php endforeach; ?>
</div>



 <script>
$(function(){
  var refreshId = setInterval(function() {
$('.onlineFriends ').load("# .onlineFriends ").fadeOut("slow", function () {
$(this).fadeIn("slow");

});
}, 50000);

});

</script>

This works good. But .load() function I think loads first all entire page and then calls .onlineFriends. I can see it with firebug on console. it returns all page source code as GET answer. My question is it will make slow down ? Because I will use this method 5 times for other div contents and each time each functions will load full page.

Also I tried to create separate .php file but I have in php code some dependences and I cant run this function in another file.

Upvotes: 2

Views: 1830

Answers (2)

Evandro Aguiar
Evandro Aguiar

Reputation: 1

Create other page friends.php and in page index use cod java/ajax and use jquery-min

<script src="js/jquery-1.10.1.min.js"></script>

$(document).ready(function() {

$("#center").load("friends.php?var=<?php echo $member['f_id']; ?>");
var refreshId = setInterval(function() {

$("#center").load('friends.php?var=<?php echo $member['f_id']; ?>');}, 9000);
$.ajaxSetup({ cache: false });

your div html use

<div class="center"></div>

your friends.php use

<?php include"your bd here" $jab = $_GET['var'];  
'select bd'
echo $resultyourneed['f_id'] ?>

Upvotes: 0

Any request to your page will result to it's full code. You can specify in php to send back only wanted part of page when specific GET or POST data is present and use $.get() or $.post() to get them.

Because I will use this method 5 times

On the same page? Then it's better to replace them from the one of $.get() and $.post() data during callback function.

Upvotes: 2

Related Questions