jQuery .load returning empty div (PHP page)

Question

I have a PHP control panel I'm currently working on. I need a div in one of my PHP files to automatically refresh and I came across an jQuery solution which can automatically reload certain parts of a website. The problem is every time I include the script, when the setInterval runs it just turns the div into a blank element instead of loading the content.

My site works by having a master PHP called "panel.php" which loads various HTML documents (.php files) using "include". One of those HTML documents is called "printers.php".

Inside printers.php I want to reload this div:

<div id="tsd"><?php echo time(); ?></div>

So at the top of my code in the head tag of "printers.php" I added this code:

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
    setInterval(function () {
        $( "#tsd" ).load("panel.php #tsd");
    }, 2000);
</script>

Now when the panel.php document loads, the timestamp shows for 2 seconds, then disappears and the div element just goes blank with no data in it. I can't figure out why it is reloading a blank div? Any ideas would help.

done any basic debugging, like checking what happens when you manually hit panel.php yourself every 2 seconds? — Marc B
– Marc B, Commented Oct 13, 2016 at 14:21
ur making the scripts run just for 2 seconds with setinterval — kerv
– kerv, Commented Oct 13, 2016 at 14:22
Why $("#tsd").load("panel.php #tsd"); And not $("#tsd").load("panel.php"); — Marcos Alexandre Sedrez
– Marcos Alexandre Sedrez, Commented Oct 13, 2016 at 14:50
If I've understood your panel.php code correctly, try $('#tsd').load('panel.php?page=printers #tsd'); If that works, let me know and i'll write up the reasoning behind it in an answer. (Don't think I can fit it in a comment) — ImClarky
– ImClarky, Commented Oct 13, 2016 at 15:51
@ImClarky, you sir are a genius! Thank you so much, I spent the whole day pondering about this one. You have fixed the issue, works a treat now! Please post this as a proper reply so I can accept your solution. Moral of the story = you need to include get parameters in a .load request too. — KillerKode
– KillerKode, Commented Oct 13, 2016 at 15:59

ImClarky · Accepted Answer · 2016-10-13 16:50:31Z

1

You forgot to add the GET parameters. Change your Interval script from:

$( "#tsd" ).load("panel.php #tsd");

to

$('#tsd').load('panel.php?page=printers #tsd');

Upon inspection of your panel.php code, I noticed this if statement:

if (!isset($_GET['page'])) 
    header('location: panel.php?page=dashboard');
else 
    include('restricted/sitepages/'.$_GET['page'].'.php');

Thereby, because you were omitting the GET parameter page it was loading the Dashboard page instead of the Printers page; and I'm guessing the Dashboard page does not have a div with the id tsd. Therefore it was loading nothing because #tsd does not exist in the loaded response.

answered Oct 13, 2016 at 16:50

ImClarky

1,9632 gold badges27 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

KillerKode Over a year ago

Thanks, really appreciate your help. It's nice to have someone else look at your code once in while. You tend to get tunnel vision when your working on something for a long time.

ImClarky Over a year ago

@user1928362 - no problem :)

cowboysaif · Accepted Answer · 2016-10-13 14:43:16Z

0

Place the html code in the panel.php and make a recursion there. So that panel.php looks like this

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
    $(document).ready( function(){

        refreshClock();
});
    function refreshClock(){
    $('#tsd').load('printers.php', function(){
       setTimeout(refreshClock, 2000);
    });
}
</script>

<div id="tsd"></div>

answered Oct 13, 2016 at 14:43

cowboysaif

2413 silver badges9 bronze badges

2 Comments

Marcos Alexandre Sedrez Over a year ago

The setInterval() method calls a function or evaluates an expression at specified intervals (in milliseconds).

KillerKode Over a year ago

Thank you for your response, I tried this but unfortunately it does not work. I believe it doesn't work because as Marcos described the setTimeout does not refresh the content after every X seconds like I need. I tried changing it to setInterval but still get the same issue.

Collectives™ on Stack Overflow

jQuery .load returning empty div (PHP page)

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related