I need to fetch data from mysql database and show it in php file. Then on homepage I need to load it automatically without reloading a page. I have achieved the result, but the data is loading automatically only when I refresh the php file.

index.php - > shows data from load.php automatically, but now shows only if I refresh load.php

load.php - > gets data from database

index.php:

<script src=".12.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {

    function load() {
        $.ajax({ //create an ajax request to load_page.php
            type: "GET",
            url: "views/index/info.php",
            dataType: "html", //expect html to be returned                
            success: function (response) {
                $("#responsecontainer").html(response);
                setTimeout(load, 1000)
            }
        });
    }

    load(); //if you don't want the click
    $("#display").click(load); //if you want to start the display on click
});
</script>
<div id="responsecontainer"></div>

load.php

            <?php 


// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT * FROM users WHERE type_account='1'";

$result = $conn->query($sql);



    while($row = $result->fetch_assoc()) {
       $username =  $row["name"];
$userid = $row["id"];     
}


$sql2 = "SELECT * FROM posts WHERE user='$userid' AND status='1'";

$result2 = $conn->query($sql2);



    while($row2 = $result2->fetch_assoc()) {
 $postdetails = $row2["post_details"];

?>
Popular Microblogs:<br>
<br>
<span style="color:#fff;">
<?php
echo $username; 
echo "<br>";
echo $postdetails;
echo "<br>";
}


echo "<br>";  



$conn->close();

echo "</span>";


?> 

I need to fetch data from mysql database and show it in php file. Then on homepage I need to load it automatically without reloading a page. I have achieved the result, but the data is loading automatically only when I refresh the php file.

index.php - > shows data from load.php automatically, but now shows only if I refresh load.php

load.php - > gets data from database

index.php:

<script src="https://ajax.googleapis./ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {

    function load() {
        $.ajax({ //create an ajax request to load_page.php
            type: "GET",
            url: "views/index/info.php",
            dataType: "html", //expect html to be returned                
            success: function (response) {
                $("#responsecontainer").html(response);
                setTimeout(load, 1000)
            }
        });
    }

    load(); //if you don't want the click
    $("#display").click(load); //if you want to start the display on click
});
</script>
<div id="responsecontainer"></div>

load.php

            <?php 


// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT * FROM users WHERE type_account='1'";

$result = $conn->query($sql);



    while($row = $result->fetch_assoc()) {
       $username =  $row["name"];
$userid = $row["id"];     
}


$sql2 = "SELECT * FROM posts WHERE user='$userid' AND status='1'";

$result2 = $conn->query($sql2);



    while($row2 = $result2->fetch_assoc()) {
 $postdetails = $row2["post_details"];

?>
Popular Microblogs:<br>
<br>
<span style="color:#fff;">
<?php
echo $username; 
echo "<br>";
echo $postdetails;
echo "<br>";
}


echo "<br>";  



$conn->close();

echo "</span>";


?> 

• javascript
• php
• jquery
• mysql

• So it doesn't work when you click #display? – Jack Commented Mar 15, 2016 at 19:47
• I have changed to $("#display").load; and deleted $(document).ready(function(){ still the data doesnt loads automatically – John Doe Commented Mar 15, 2016 at 19:52
• Try '$('#handle').on('click', function(){ load() })' – Matt Greenberg Commented Mar 15, 2016 at 19:55
• Can't see why your code should not work. But some hints: if someone presses the display button your code will load 2 times a second if he preses 1 more time 3 times... You are selecting all users but only using the posts of the last. – Roland Starke Commented Mar 15, 2016 at 19:56
• 1 There must be info you are not telling us, as you have url: "views/index/info.php", but your file is load.php. Last time I checked info!=load. – Sean Commented Mar 15, 2016 at 20:04

1 Answer 1

you can do it like below:-

<script src="https://ajax.googleapis./ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
    ajax_call = function() {
        $.ajax({ //create an ajax request to load_page.php
            type: "GET",
            url: "views/index/info.php",
            dataType: "html", //expect html to be returned                
            success: function (response) {
                $("#responsecontainer").html(response);
            }
        });
    };
    var interval = 5000;
    setInterval(ajax_call, interval);
});
</script>
<div id="responsecontainer"></div>

Note:- you ajax will run automatically after 5 second without page refresh.