Click here to Skip to main content
15,945,119 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
I am currently stuck on a problem and not sure how to solve it. I am new to php and javascript coding so do please correct me if there is an easier way to do this.

My problem is that I am trying to get a countdown timer working for multiple data in mysql database. I have already made a successful countdown time function that only works with one data using the if statement in php, but when I try to do it with multiple data using the while statement in php it doesn't work.here is my php code.

PHP
//TODAY'S DATE
$today = time();

//FETCHES DATE AND TIME FOR THE EVENT FROM DATABASE
$sql = "SELECT * FROM post";
$result = mysqli_query($conn, $sql);

while ($row = mysqli_fetch_assoc($result)) {
    $title = $row['title'];
    $cname = $row['cname'];
    $team = $row['team'];
    $description = $row['description'];
    $endtime = $row['endtime'];

    echo "<tr>";
    echo "<td width='16%'>Title:</td>";
    echo "<td width='16%'>$title</td>";
    echo "</tr><tr>";
    echo "<td width='16%'>Client name:</td>";
    echo "<td width='16%'>$cname</td>";
    echo "</tr><tr>";
    echo "<td width='16%'>Team:</td>";
    echo "<td width='16%'>$team</td>";
    echo "</tr><tr>";
    echo "<td width='16%'>Description:</td>";
    echo "<td width='16%'>$description</td>";
    echo "</tr><tr>";
    echo "<td width='16%'>End time:</td>";
    echo "<td width='16%'>$endtime</td>";
    echo "</tr><tr>";
    echo"</BR>";
    echo"</BR>";
}

$conn->close();


below is my javascript that suppose to run the count down


JavaScript
var today = new Date();
var DD = today.getDate();
var MM = today.getMonth()+1; //January is 0!
var YYYY = today.getFullYear();
//let get the Difference in Sec btw the two dates
var _DateFromDBProgEndDate = '<?php echo $endtime; ?>';
var ProgEndTime = new Date(_DateFromDBProgEndDate);
var TodayTime = new Date();

var differenceTravel = ProgEndTime.getTime()- TodayTime.getTime() ;
var seconds = Math.floor((differenceTravel) / (1000));
////////////////////////////////
var SecDiffFromToday = seconds;
var seconds = SecDiffFromToday;

function pad(n) {
   // utility function to pad a number to 2 digits:
   return ('0' + n).substr(-2); 
}

function timer() {
    var todaySeconds = Math.floor(new Date().getTime() / 1000);
    // collect the html first in an array
    var html = [];
    // keep track whether there are still counters not yet zero:
    var allDone = true;
    // go through the list of dates:
    endDatesInSeconds.forEach(function (endDateSeconds) {
        var totalSeconds = endDateSeconds - todaySeconds;
        var days        = Math.floor(totalSeconds/24/60/60);
        var seconds     = Math.floor(totalSeconds - days*86400);
        var hours       = Math.floor(seconds/3600);
        seconds         = Math.floor(seconds - hours*3600);
        var minutes     = Math.floor(seconds/60);
        seconds         = seconds % 60;
        // add a part of html
        html.push(
            totalSeconds <= 0 
               ? 'project time Completed'
               : days + ":" + pad(hours) + ":" + pad(minutes) + ":" + pad(seconds));
        // when at least one counter is not complete, we are not done:
        allDone = allDone && totalSeconds <= 0;
    });
    // now put the html in the document:
    document.getElementById('countdown').innerHTML = html.join('<br/>');
    if (allDone) {
        clearInterval(countdownTimer);
    }
}

var countdownTimer = setInterval('timer()', 1000);
<script>
the javascript run the countdown by getting it value from the php (var _DateFromDBProgEndDate = '';)
Posted

1 solution

I don't see where the 'endDatesInSeconds' array is loaded or initialized ...
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900