Ahmed Safadi Ahmed Safadi - 1 year ago 57
Javascript Question

content hide after data reload with ajax

I'm trying to learn ajax and i got small problem

I created a div

Here is my index.php

$con = new mysqli($localhost, $username, $password, $database);
$selectchampions = $con->query("SELECT * FROM `experts`");
$row = $selectchampions->fetch_assoc();
<div id="summary"><h1><?php echo $row['expert_country']; ?></h1></div>


and this is the script

<script>
function updateShouts() {
// Assuming we have #shoutbox
$('#summary').load('changediv.php');
}
setInterval("updateShouts()", 10000);
</script>


and changediv.php

$selectchampions = $con->query("SELECT * FROM `experts`");
$row = $selectchampions->fetch_assoc();


the problem is that after 1 second the content gets changed very well but it wouldn't render in html, if i check in the source of page it show the correct content but in the rendered page it will hide

example

enter image description here

Answer Source

You aren't returning any HTML/content back to the call so it won't be showing anything...

In your changediv.php file, you need to fetch content and return it:

$selectchampions = $con->query("SELECT * FROM `experts`");
$row = $selectchampions->fetch_assoc();

echo $row['expert_country'];

Just one thing to note though; it's always going to show the first row so you'll need to adjust that.