PHP/JS clock not showing user's timezone and not displaying seconds as they change

Question

I have a clock that I am tring to use on my site and it works really well as in it shows the time but there are still two things that I need it to do:

I need it to display the time in my timezone, the server's timezone.
I need the clock to keep real time. (i.e., display the seconds as they change)

Code:

<script> 
function displayTime() { 
  document.getElementById( "servertime" ).innerHTML = '<?=date("h:i:s A");?>'; 
} 

var serverTime = window.setInterval( "displayTime()", 1200 ); 
</script>

It is posting to: 'Loading ...' – Jesse Pfieffer Dec 10 '12 at 18:56 — Jesse Pfieffer, Dec 10 '12 at 18:56

score 2 · Answer 1 · answered Dec 10 '12 at 18:52

2

Set your timezone with default-timezone-set.

To move seconds you have to use JavaScript increment for Hour, minute, seconds.

answered Dec 10 '12 at 18:52

Lenin

570
16
36

fanfavorite · Accepted Answer · 2012-12-10T19:08:01.773

2

Try something like this:

var serverTime = new Date();

function displayTime(){
    serverTime.setSeconds(serverTime.getSeconds()+1);
    document.getElementById("servertime").innerHTML = serverTime.getHours()+":"+serverTime.getMinutes()+":"+serverTime.getSeconds();
}

window.onload=function(){
    setInterval(displayTime, 1000)
}

This will use the time of the users machine. If you want to set a certain timezone, either set in your PHP configuration file or set it at beginning of your script and then put the value in the new Date javascript function. Something like:

var serverTime = new Date('<?=date("m/d/Y H:i:s T", time())?>');

edited Dec 10 '12 at 19:08

answered Dec 10 '12 at 18:55

fanfavorite

5,128
1
31
58

Isn't using strings in setInterval kind of evil like using `eval` ? `setInterval(displayTime,1000)` should do it – Moritz Roessler Dec 10 '12 at 19:00
It worked!!! it is counting and everything! Any chance you can tell me why it just says Nah:Nah:Nah when I insert my format? "h:i:s A" – Jesse Pfieffer Dec 10 '12 at 19:04
Yeah in this case its better to remove the parentheses. – fanfavorite Dec 10 '12 at 19:10
I used your formate code and it just sits there loading and never comes around and shows the time? – Jesse Pfieffer Dec 10 '12 at 19:10
1

NaN (Not A Number) means its not in the proper format. Sorry, made a mistake with my PHP portion. Need to have returned time in the new Date. I have edited that. – fanfavorite Dec 10 '12 at 19:13
Not sure what you edited but its still not working see: http://jsbin.com/efadoq/5/ – Jesse Pfieffer Dec 10 '12 at 19:21
For JS date formatting have a look at this [post](http://stackoverflow.com/questions/1056728/formatting-a-date-in-javascript) – Lenin Dec 10 '12 at 19:34
Im not that good at codeing and have ADHD so... I am not seeing the answer on that page... – Jesse Pfieffer Dec 10 '12 at 19:59
The problem with the jsbin is the fact you are trying to run PHP in a js file. If the js is in a separate file, rename it to .php and update your script accordingly. – fanfavorite Dec 10 '12 at 20:16

score 0 · Answer 3 · answered Dec 10 '12 at 18:58

something like this should do it

var startTime = (function () {
  var el = document.getElementById("servertime");
function displayTime() {
  var d = new Date();
      el.innerHTML = d.getHours() + ":" + d.getMinutes() + ":"+ d.getSeconds();
}
  window.setInterval(displayTime,300)
})()

Example on JSBin

PHP/JS clock not showing user's timezone and not displaying seconds as they change

3 Answers3