PHP Script - Live Clock with Timezone

Question

i want a live updated clock for my Server time. basicly its refreshing the date('H:i:s T'); but i cannot get it working.

it should be updated in:

<div id="clock"> </div>

the function i created looks like that:

<script>
function digitalClock() {
  var hrs;
  var mins;
  var tsecs;
  var secs;
  hrs = <?php echo date('H')?>;
  mins = <?php echo date('i')?>;
  secs = <?php echo date('s')?>;


  var ctime = hrs + ":" + mins + ":" + secs + " CEST";
  document.getElementById("clock").firstChild.nodeValue = ctime;
}
window.onload = function() {
  digitalClock();
  setInterval(digitalClock, 1000);
}
</script>

So actually its putting out the correct time but its not updating at all.

if anyone could help i would really appreciate.

If someone could explain how i could make it WITH my CEST Timezone in javascipt, that would be awesome.

Shouldn't setInterval('digitalClock()', 1000); be setInterval('digitalClock', 1000); and I'd consult the console for any issues. — Script47
– Script47, Commented Jun 29, 2018 at 14:30
Secondly, why don't you use JavaScript's date functions instead of PHP? — Script47
– Script47, Commented Jun 29, 2018 at 14:30
If you want to get server time, you'll have to use some kind of ajax call - at the moment you're refreshing the field with the same php-echoed Timestamp over and over again... — Matthias Schmidt
– Matthias Schmidt, Commented Jun 29, 2018 at 14:31
You need to learn the difference between client-side scripting and server-side scripting. Your PHP functions are only going to run once, before any of the Javascript is executed. — Patrick Q
– Patrick Q, Commented Jun 29, 2018 at 14:31
The server side code (php) will only run once while the code is being parsed, have a look at ajax or server-sent events for this purpose — empiric
– empiric, Commented Jun 29, 2018 at 14:32

AraByte · Accepted Answer · 2018-06-29 15:08:48Z

In your case, the values of hour and minutes and seconds are fixed as PHP will display them once, after that they will be constants, what you need to do is to refresh those values every time the digitalClock() is triggered, here's a way to do so (you further edit this code to match you time zone/server time) and hopefully it will help you

<div id="clock"> </div>
    <script>
    function digitalClock() {
      var d = new Date();
      var h = d.getHours();
      var m = d.getMinutes();       
      var s = d.getSeconds();   
      var hrs;
      var mins;
      var tsecs;
      var secs;
      hrs = h;
      mins = m;
      secs = s;
      var ctime = hrs + ":" + mins + ":" + secs + " CEST";
      document.getElementById("clock").firstChild.nodeValue = ctime;
    }
    window.onload = function() {
      digitalClock();
      setInterval('digitalClock()', 1000);
    }
    </script>

You can use php to get whatever timezone you want.

<?php

date_default_timezone_set("Europe/Berlin");
$tz_time = date("F j, Y h:i:s");

?>
<p id="clock"></p>

<script type="text/javascript">
                        var currenttime = '<?php echo $tz_time;?>'; // Timestamp of the timezone you want to use, in this case, it's server time
                        var servertime=new Date(currenttime);
                        function padlength(l){
                            var output=(l.toString().length==1)? "0"+l : l;
                            return output;
                        }
                        function digitalClock(){
                            servertime.setSeconds(servertime.getSeconds()+1);
                            var timestring=padlength(servertime.getHours())+":"+padlength(servertime.getMinutes())+":"+padlength(servertime.getSeconds());
                            document.getElementById("clock").innerHTML=timestring + " CEST";
                        }
                        window.onload=function(){
                        setInterval("digitalClock()", 1000);
                        }
</script>

its helped, but if i change my computers time to something else, it wont display CEST Timezone aka Europe/Berlin anymore.

Collectives™ on Stack Overflow

PHP Script - Live Clock with Timezone

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related