javascript timer not counting down when retrieving time from db

Question

I am trying to follow a jsfiddle example to create a time in javascript:

Now obviously the timer in the jsfiddle works fine. But the issue I have is that the time which the timer starts from comes for a mysqli/php variable where it retrieves the time from the db.

So except for:

<span id="countdown">01:30:10</span>

I have to have it as:

echo "<p><span id='countdown'>" . $dbSessionDuration . "</span></p>";

AND

except for:

var time = "01:30:10",

I have to have it as:

var time = <?php echo json_encode($dbSessionDuration); ?>,

Now I am getting no errors but what is happening is that the timer is not doing a count down. My question is why is it not counting down? An example of the time from the variable could be 01:00:00.

Below is the code for the function:

echo "<p><span id='countdown'>" . $dbSessionDuration . "</span></p>";


...

         <script type="text/javascript">


    (function(){
  $(document).ready(function() {
    var time = <?php echo json_encode($dbSessionDuration); ?>,
      parts = time.split(':'),
      hours = +parts[0],
      minutes = +parts[1],
      seconds = +parts[2],
      span = $('#countdown');

    function correctNum(num) {
      return (num<10)? ("0"+num):num;
    }

    var timer = setInterval(function(){
        seconds--;
        if(seconds == -1) {
            seconds = 59;
            minutes--;

            if(minutes == -1) {
                minutes = 59;
                hours--;

                if(hours==-1) {
                  alert("timer finished");
                  clearInterval(timer);
                  return;
                }
            }
        }
        span.text(correctNum(hours) + ":" + correctNum(minutes) + ":" + correctNum(seconds));
    }, 1000);
  }); 
});

</script>

ruakh · Accepted Answer · 2013-02-07 00:23:01Z

1

Change this:

  }); 
});

</script>

to this:

  }); 
})();            //  ←  note the extra parentheses

</script>

so that you actually call your anonymous function. (Alternatively, you can simply remove its (function(){ and }); entirely. There's no reason for this code to be in a function at all.)

answered Feb 7, 2013 at 0:23

ruakh

185k29 gold badges292 silver badges324 bronze badges

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

Comments

Jarealist · Accepted Answer · 2013-02-07 00:16:45Z

1

I don't know if this was a mistype but I was able to run this code by adding $, $(function(){, at the first part of your anonymous function. I'm assuming your value from the db comes in as hours:mins:secs. I'm not sure why Fiddler ran but I had to add that to get it to work in my environment.

answered Feb 7, 2013 at 0:16

Jarealist

768 bronze badges

1 Comment

Jarealist Over a year ago

Though Ruakh is correct. The code will be executed when the page has loaded if you remove the anonymous function call.

Collectives™ on Stack Overflow

javascript timer not counting down when retrieving time from db

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related