echo a message on reaching 0 on jquery countdown timer?

crf1121359 · September 19, 2013

I am at my wits end with this as i really need to move on and I'm stuck with such a simple task! any help would be greatly appreciated.

what I am trying to do is to echo a Times Up message once the countdown reaches 0.

I know the plugin has an onExpiry Function but I don't want to use javascript. I want to use PHP so the users can't disable it.

This is my full code:

<?php 
error_reporting(E_ALL);
ini_set('display_errors', '1');
?>
<?php date_default_timezone_set('GMT'); ?>
<?php
session_start();
// Run a select query to get my letest 6 items
// Connect to the MySQL database  
include "config/connect.php";
$dynamicList = "";
$sql = "SELECT * FROM item ORDER BY id ";
$query = mysqli_query($db_conx, $sql);
$productCount = mysqli_num_rows($query); // count the output amount
if ($productCount > 0) {
    while($row = mysqli_fetch_array($query, MYSQLI_ASSOC)){ 
             $id = $row["id"];
             $product_name = $row["product_name"];
             $date_added = date("Y, m, d", strtotime($row["date_added"]));
             $end_date = date("Y, m, j, G, i, s", strtotime($row["end_date"]));
             $price = $row["price"];
             $dynamicList .= '<div>' . $end_date . '
      </div>';
    }
} else {
    $dynamicList = "No Records";
}
?>
<?php
$tmp_date = explode(', ', $end_date);
$tmp_date[1] = $tmp_date[1] - 1;
$end_date = implode(', ', $tmp_date);
?>
<?php
$date = $end_date;
$exp_date = date("Y, m, j, G, i, s", strtotime($date));
$now = time();

if ($now < $exp_date ) {
?>

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>

    <noscript>
        <h3>JavaScript is disabled!
        Please enable JavaScript in your web browser!</h3>

        <style type="text/css">
            #defaultCountdown { display:none; }
        </style>
    </noscript>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>jQuery Countdown</title>
    <link rel="stylesheet" href="jquery.countdown.css">
    <style type="text/css">
    #defaultCountdown { width: 240px; height: 45px; }
    </style>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" src="jquery.countdown.js"></script>

    <script type="text/javascript">

     $(document).ready(function () {
        $('#defaultCountdown').countdown({
            until: new Date(<?php echo $end_date ?>),
            compact: true,
            onTick: warnUser
        });
    });



    </script>
    </head>
    <body>
    <?php
    } else {
        echo "Times Up";
    }
    ?>

    <div id="defaultCountdown" style="font-family:Verdana, Geneva, sans-serif;"></div>

    <?php
    } else {
        echo "Times Up";
    }
    ?>
    </body>
    </html>

Currently I am using the code above but all i get is the (Times Up) message without anything else on the page and this is when the timer has hours to end but when i remove these lines:

<?php
$date = $end_date;
$exp_date = date("Y, m, j, G, i, s", strtotime($date));
$now = time();

if ($now < $exp_date ) {
?>

and

<?php
} else {
    echo "Times Up";
}
?>

the timer shows up and starts working again. I need to find a way to show/display the Times Up message as soon as the counter hits 0 and I need to do it via PHP for security reasons.

Thanks in advance.

cyberRobot · September 19, 2013

PHP code is executed on the server. What you're trying to do needs to happen on the client side. To perform client-side interaction, you'll need to stick with a client-side solution like JavaScript.

crf1121359 · September 19, 2013

PHP code is executed on the server. What you're trying to do needs to happen on the client side. To perform client-side interaction, you'll need to stick with a client-side solution like JavaScript.

you couldn't be more wrong mate, and to prove my point I have another code which will do EAXCTLY what i want but i don't want to use the code as the javascript on the timer is lagging and here is the code:

<?php
$date = $end_date;
$exp_date = strtotime($date);
$now = time();

if ($now < $exp_date ) {
?>
<script>
// Count down milliseconds = server_end - server_now = client_end - client_now
var server_end = <?php echo $exp_date; ?> * 1000;
var server_now = <?php echo time(); ?> * 1000;
var client_now = new Date().getTime();
var end = server_end - server_now + client_now; // this is the real end time

var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour *24
var timer;

function showRemaining()
{
    var now = new Date();
    var distance = end - now;
    if (distance < 0 ) {
       clearInterval( timer );
       document.getElementById('countdown').innerHTML = 'EXPIRED!';

       return;
    }
    var days = Math.floor(distance / _day);
    var hours = Math.floor( (distance % _day ) / _hour );
    var minutes = Math.floor( (distance % _hour) / _minute );
    var seconds = Math.floor( (distance % _minute) / _second );

    var countdown = document.getElementById('countdown');
    countdown.innerHTML = '';
   if (days) {
        countdown.innerHTML += 'Days: ' + days + '<br />';
    }
    countdown.innerHTML += 'Hours: ' + hours+ '<br />';
    countdown.innerHTML += 'Minutes: ' + minutes+ '<br />';
    countdown.innerHTML += 'Seconds: ' + seconds+ '<br />';
}

timer = setInterval(showRemaining, 1000);
</script>
<?php
} else {
    echo "Times Up";
}
?>
<div id="result"><div id="countdown"></div></div>

cyberRobot · September 19, 2013

And this works with JavaScript disabled?

Also, where is $end_date defined?

crf1121359 · September 19, 2013

And this works with JavaScript disabled?

Also, where is $end_date defined?

it doesn't work with javascript disabled but at least PHP will echo the "Times Up" message or any other message if the javascript is not enabled. also, its not just the case of echoing a message! What i can do with PHP i wont be able to do with javascript if the user disable their javascript. its just not a good practice to rely on javascript especially in these day and age when there are 1000's of people/hackers trying to make a name for themselves by hacking other people's site. its bad enough to keep up with PHP updated etc...

anyway, the $end_date is a field in mysql table which will hold the datetime (time that the item will/should end).

cyberRobot · September 19, 2013

Unless I'm missing something, you're looking to replace the JavaScript which handles the count-down portion that happens after the page loads. Once the page loads, you're dealing with client-side interactions. That's where JavaScript comes in.

As far as I'm aware, there isn't a way to do what you're asking without something like JavaScript. You might be able to minimize the amount of JavaScript being utilized with Ajax. But keep in mind that Ajax is JavaScript and can be turned off.

Edited September 19, 2013 by cyberRobot

vinny42 · September 20, 2013

you couldn't be more wrong mate

He's right, PHP cannot interact with the browser. If you think it can, then you are not building what you think you are building.

What you've done here is redefined what you are trying to do from "display a message when a countdown reaches zero" to "display a message when a page is reloaded after X time has passed".

This will not stop people from taking as long as they want to complete a task.

PaulRyan · September 20, 2013

This will not stop people from taking as long as they want to complete a task.

I'm assuming that the OP has stored the start time of what ever task is being performed.

Providing they have, they can check on submission of a form or something, to see if a certain amount of time has passed and if it has, then they have ran out of time to perform said action.

vinny42 · September 20, 2013

I'm assuming that the OP has stored the start time of what ever task is being performed.

I hope so, but I doubt it.

Sign In

echo a message on reaching 0 on jquery countdown timer?

Recommended Posts

crf1121359

Link to comment

Share on other sites

cyberRobot

Link to comment

Share on other sites

crf1121359

Link to comment

Share on other sites

cyberRobot

Link to comment

Share on other sites

crf1121359

Link to comment

Share on other sites

cyberRobot

Link to comment

Share on other sites

vinny42

Link to comment

Share on other sites

PaulRyan

Link to comment

Share on other sites

vinny42

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information