Javascript countdown in a PHP while loop

Question

EDIT: SOLVED.

The 'items' table has multiple tuples, and for each of them I used to have name,image,price,description and a bid system (a text field and a submit) to be printed on a webpage. It worked wondefully until I decided I wanted each of them to have a countdown timer too. This timer works this way: every time there's a new bid on an item, the item's timer resets to X minutes/seconds/whatever. When I insert include.php into the original code, only the first instance is processed.

I know this is due to PHP and Javascript not 'running' at the same time, but I wonder how can I fix my Javascript to have the problem sorted out.

The classic echo solution doesn't work.

this is the while loop:

while ($row = @ mysql_fetch_array($results))
{

print
"<div id='item'>".
"<p>".$row["name"]."</p>".
"<img src= uploads/".$row["image"].">".
"<p>&euro;".$row["final_price"]."</p>".
"<p>".$row["description"]."</p>".
"<form method = 'get' action = 'sum.php'>".
"<input type = 'hidden' name = 'itid' value = ".$row["id"].">".
"<tr><td><input type = 'number' name = 'bid' required = 'required'></td></tr><br>".
"<tr><td><input type = 'submit' value = 'Bid'></td></tr>".
"</form>";
include('cntdwn.php');
print
"</div>";
}

SOLVED by setting cntdwn.php this way:

<?php
${"query1".$row['id']}= "SELECT time_up FROM items WHERE id = '" .$row["id"]."'";
${"results".$row['id']} = mysql_query (${"query1".$row['id']});
while (${"row".$row['id']} = @ mysql_fetch_array(${"results".$row['id']})) {${"rez".$row['id']} = ${"row".$row['id']}['time_up'];}
//$date = 'January 22 2017 09:10:00 PM CET';
${"exp_date".$row['id']} = strtotime(${"rez".$row['id']});
${"now".$row['id']} = time();

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

var _second<?php echo $row['id']; ?> = 1000;
var _minute<?php echo $row['id']; ?> = _second<?php echo $row['id']; ?> * 60;
var _hour<?php echo $row['id']; ?> = _minute<?php echo $row['id']; ?> * 60;
var _day<?php echo $row['id']; ?> = _hour<?php echo $row['id']; ?> *24;
var timer<?php echo $row['id']; ?>;

function showRemaining<?php echo $row['id']; ?>()
{
    var now<?php echo $row['id']; ?> = new Date();
    var distance<?php echo $row['id']; ?> = end<?php echo $row['id']; ?> - now<?php echo $row['id']; ?>;
    if (distance<?php echo $row['id']; ?> < 0 ) {
       clearInterval( timer<?php echo $row['id']; ?> );
       location.reload();

       return;
    }
    var days<?php echo $row['id']; ?> = Math.floor(distance<?php echo $row['id']; ?> / _day<?php echo $row['id']; ?>);
    var hours<?php echo $row['id']; ?> = Math.floor( (distance<?php echo $row['id']; ?> % _day<?php echo $row['id']; ?> ) / _hour<?php echo $row['id']; ?> );
    var minutes<?php echo $row['id']; ?> = Math.floor( (distance<?php echo $row['id']; ?> % _hour<?php echo $row['id']; ?>) / _minute<?php echo $row['id']; ?> );
    var seconds<?php echo $row['id']; ?> = Math.floor( (distance<?php echo $row['id']; ?> % _minute<?php echo $row['id']; ?>) / _second<?php echo $row['id']; ?> );

    var countdown<?php echo $row['id']; ?> = document.getElementById('countdown<?php echo $row['id']; ?>');
    countdown<?php echo $row['id']; ?>.innerHTML = '';
    if (days<?php echo $row['id']; ?>) {
        countdown<?php echo $row['id']; ?>.innerHTML += 'Days: ' + days<?php echo $row['id']; ?> + '<br />';
    }
    countdown<?php echo $row['id']; ?>.innerHTML += 'Hours: ' + hours<?php echo $row['id']; ?>+ '<br />';
    countdown<?php echo $row['id']; ?>.innerHTML += 'Minutes: ' + minutes<?php echo $row['id']; ?>+ '<br />';
    countdown<?php echo $row['id']; ?>.innerHTML += 'Seconds: ' + seconds<?php echo $row['id']; ?>+ '<br />';
}

timer<?php echo $row['id']; ?> = setInterval(showRemaining<?php echo $row['id']; ?>, 1000);
</script>
<?php
}
else {
    ${"winnerquery".$row['id']}= "SELECT u_mail FROM bids WHERE datestamp = (SELECT MAX(datestamp) FROM bids) AND i_id = '".$row['id']."' LIMIT 1";
    ${"rezul".$row['id']} = mysql_query(${"winnerquery".$row['id']});
    while (${"rol".$row['id']} = mysql_fetch_array(${"rezul".$row['id']})) { ${"rel".$row['id']} = ${"rol".$row['id']}['u_mail'];}
    ${"relative".$row['id']} = mysql_query("UPDATE items SET sold = '1',sold_to = '".${"rel".$row['id']}."' WHERE id = '".$row['id']."'");
 echo "Times Up";


}
?>
<div id="countdown<?php echo $row['id']; ?>"></div>

Please [stop using `mysql_*` functions](http://stackoverflow.com/questions/12859942/why-shouldnt-i-use-mysql-functions-in-php). [These extensions](http://php.net/manual/en/migration70.removed-exts-sapis.php) have been removed in PHP 7. Learn about [prepared](http://en.wikipedia.org/wiki/Prepared_statement) statements for [PDO](http://php.net/manual/en/pdo.prepared-statements.php) and [MySQLi](http://php.net/manual/en/mysqli.quickstart.prepared-statements.php) and consider using PDO, [it's really pretty easy](http://jayblanchard.net/demystifying_php_pdo.html). — Jay Blanchard, Jan 27 '16 at 13:40
Have you opened the browser's console to see if there are errors there? — Jay Blanchard, Jan 27 '16 at 13:42
There are no errors, and the page is printed normally, but instead of showing, let's say, 4 divs out of 4, it only shows 1 div out of 4. — Morgenritter, Jan 27 '16 at 16:59
That code is just hideous. variable variables, to simulate arrays? That's incredibly painful to look at. — Marc B, Feb 04 '16 at 14:20
It's not refined, I admit it, but it works. And if it works, I get paid. — Morgenritter, Feb 04 '16 at 19:05

Javascript countdown in a PHP while loop

0 Answers0