Charles Tester Charles Tester - 4 months ago 13
jQuery Question

Div tag not reloading

I am attempting to reload only a

div
tag on a page when there is new content in the database

in Ajax I test for new content:

function adshandler() {
var d = new Date();
var cache = d.getTime();
$.getJSON("check_time.php?cache=" + cache, function(update) {
if (update.count === true) {
//location.reload();
$('#slideshow').reload();
}
});
}
setInterval(adshandler, 10000);


The
div
is on the same page as the ajax:

//Monday Afternoon
if ($dayofweek == "Monday" && $timeofday >= "12:00:00" && $timeofday <= "16:59:59"){
//Monday afternoon timeslot
echo "<div id='slideshow'>";
$stma= $conn->prepare("SELECT `Monday_Afternoon`
FROM `Client_Ads`");
$stma->execute();
while($resultst = $stma-> fetch()){
$mondayafternoonlist = $resultst["Monday_Afternoon"];
echo "<div class='slideshow'>";
echo "<img src='/$mondayafternoonlist'>";
echo "</div>";
}
echo "</div>";
}


There are more than one
div with a similar
id
and
class
, each one behind an
if
and
else if` statement, depending on the day of the week etc.

My
$('#slideshow').reload();
is not working?
I have also tried
$('#slideshow').load();
.

Answer

You can achieve it using .load() function in very few line. Following is a working example.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script>
    function changeDate() {
        $("#d2p").load(location.href + " #d2");
    }
</script>
<div id="d1p">
    <div id="d1">
        <?php echo date("H : i : s"); ?>
    </div>
</div>

This is the DIV which is going to refreshed on click of button partially on this page.

<div id="d2p">
    <div id="d2">
        <?php echo date("H : i : s"); ?>
    </div>
</div>
<button onclick="changeDate();">Change Date</button>

Here is the demo Load div without refreshing entire page

Comments