Reputation:
I have written code in PHP. Which shows posts done by different users. I have just included that page in another page just to view it along with other elements. Now i want that the portion which i have included must refresh after some interval automatically. I know it could be achieved by AJAX but I don't know much about it. below is the code on post.php file whic i have include in main page using include"post.php";
now on the main page i want the the output of this code below refresh every 30seconds on main page but not reloading the page
<?php
$fetchpost=mysqli_query($conn,"select * from post where b_id IN (select u_id from frndlist where b_id='$b_id')");
?><?php
while($fpost=mysqli_fetch_array($fetchpost)){
$author_id=$fpost[0];
$post_id=$fpost[1];
$post_date=$fpost[2];
$inb_namefetch=mysqli_query($conn,"select b_name from ub_per where b_id='$author_id'");/*getting author's name*/
$inb_mailfetch=mysqli_query($conn,"select b_email from ub_per where b_id='$author_id'");/*getting author's email*/
$inb_mailfetched=mysqli_fetch_array($inb_mailfetch,MYSQLI_ASSOC);
foreach($inb_mailfetched as $authormail){
$authormail;
}
$inb_profpicfetch=mysqli_query($conn,"select prof_pic from ub_per where b_id='$author_id'");/*getting author's profile picture*/
$inb_namefetched=mysqli_fetch_array($inb_namefetch,MYSQLI_ASSOC);
$inb_profpicfetched=mysqli_fetch_array($inb_profpicfetch,MYSQLI_ASSOC);
foreach($inb_profpicfetched as $fetchedimage){
$piccheck=$fetchedimage;
}
if(isset($piccheck)){
$authorimage="http://localhost/uploads/".$authormail."/profilepics/".$fetchedimage;
; }else{$authorimage="http://localhost/content/user.jpg";}
foreach($inb_namefetched as $authorl){
$author=ucwords($authorl);
}
if(isset($fpost[3])){
$post_content=$fpost[3];
}
if(isset($fpost[4])){
$post_image=$fpost[3];
}
?><div class="postingdiv">
<table>
<tr class="authortr" ><td class="author"><a id="imlink" href="http://localhost/profile/view_profile.php?id=<?php echo $author_id; ?>"><img class="authorpic" src="<?php echo $authorimage;?>"></a><a id="tlink" href="http://localhost/profile/view_profile.php?id=<?php echo $author_id; ?>"><?php echo $author; ?></a></td></tr>
<tr class="posttr" ><td class="post"><?php if(isset($post_content)){echo $post_content;} if(isset($post_image)){echo "<br><img id='postimg' src='http://localhost/uploads/".$author_mail."/postpics/".$postimage."'>";} ?></td></tr>
</table></div>
<?php include"commenter.php";
?>
<div class="makoment"><form name="mkoment" method="post" action="http://localhost/content/comment/makecomment.php" ><input type="hidden" name="commentere" value="<?php echo $b_id; ?>"><input type="hidden" name="postsid" value="<?php echo $post_id; ?>"> <textarea class="mycommentarea" name="accomment" placeholder="make a comment"></textarea><br><input type="submit" class="commentbutton" value="Comment"></form></div>
<br>
<?php
}
?>
Upvotes: 0
Views: 784
Reputation: 494
You didn't specify your current setup, so this is in general.
First, do a check on server side if the request is made with AJAX so you can send a specific part of the page only or use a different route/page/file to serve the request.
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
echo 'Requested with AJAX';
}
Then on the browser-side, use JavaScript to send a GET request every x seconds. Something like
setTimeout(function() {
var ajax = new XMLHttpRequest();
ajax.onreadystatechange = function() {
if (ajax.readyState == XMLHttpRequest.DONE) {
if (ajax.status == 200) {
document.getElementById('posts').innerHTML = ajax.responseText;
}
}
}
ajax.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); // Let PHP know we're doing it with AJAX.
ajax.open("GET", "/posts.php", true);
ajax.send();
}, 5000); // 5000 milliseconds = 5 seconds.
Upvotes: 0
Reputation: 11987
Try like this
setInterval(function(){
$.ajax({
url:"path to php file",
data:{key:value},//key value pairs
type:"POST"
success: function(data){
alert(data);
}
});
},10000);
^ interval you want(now its 10 seconds)
Upvotes: 0
Reputation: 9001
An example of doing so with jQuery:
setInterval(updateFn, 1000 /* or however long you want the interval */);
function updateFn(){
$.post("page.php", function(response){
console.log(response); //handle the data pinged back by the PHP page in the variable 'response'
});
}
References:
Upvotes: 0