Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Mar 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    countdown timer using Javascript and php

    Hi folks,

    I am in need of a functionality for a system where in there is PHP mysql system having a table "bid" which has columns(bid_product, "createtime")

    basically if the user does not bid for the product within 20 hours the bid will close for this i need to display a timer which keeps counting till 5+ hours or so of the createtime, After a tiring search for timers i finally found a .Js which would work just fine for static values

    Within the .js script when i tried to pass values from my database the timer does not change on itself but each time i have to refresh the page to check the time left.

    Please have a look at the code and let me know what could be wrong

    testingtime.php
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    	<title>Vott</title>
    	<script type="text/javascript" src="js/testtime.js"></script>
    	<style>
    	p.timer{font-size:15px; color:#43C6DB; border: 2px solid #fc0;width: 100px; position: absolute; top: 350px; left: 375px;}
    	</style>
    	
    
    </head>
    
    <body>
    <table style="background-color: #CCC" width="100%" border="0" cellpadding="12">
      <tr>
        <td width="78%"><h1>My Logo Image</h1></td>
      </tr>
    </table>
    
    	<span class="bids">
    	
    		<p class="timer"><b>bid Closes in :</br>
    		<span id="timeleft"> <script>timeleft('<?php print($bid['createtime']); ?>')</script>
    		</span></b></p></span></br></br>
    		
    		</body>
    		</html>
    The Javascript code
    Code:
    var eventtext = "Left"; // text that appears next to the time left
    var endtext = "bids Closed!!"; // text that appears when the target has been reached
    
    function timeleft(mydate){
    
    // Split timestamp into [ Y, M, D, h, m, s ]
    var t = mydate.split(/[- :]/);
    // Apply each element to the Date function
    var date = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]);
    
    // -> Wed Jun 09 2010 13:12:01 GMT+0100 (GMT Daylight Time)
    
    var year = date.getYear();			// in what year will your target be reached?
    var month = date.getMonth();			// value between 0 and 11 (0=january,1=february,...,11=december)
    var day = date.getDate();				// between 1 and 31
    var hour =date.getHours();				// between 0 and 24
    var minute = date.getMinutes();			// between 0 and 60
    var second = date.getSeconds();			// between 0 and 60
    var end = new Date(year,month,day,hour,minute,second);
    end.setMinutes(end.getMinutes() + 50);
    	var now = new Date();
    	if(now.getYear() < 1900)
    		yr = now.getYear() + 1900;
    	var sec = end.getSeconds() - now.getSeconds();
    	var min = end.getMinutes() - now.getMinutes();
    	var hr = end.getHours() - now.getHours();
    	var dy = end.getDate() - now.getDate();
    	var mnth = end.getMonth() - now.getMonth();
    	var yr = year - yr;
    	var daysinmnth = 32 - new Date(now.getYear(),now.getMonth(), 32).getDate();
    	if(sec < 0){
    		sec = (sec+60)%60;
    		min--;
    	}
    	if(min < 0){
    		min = (min+60)%60;
    		hr--;	
    	}
    	if(hr < 0){
    		hr = (hr+24)%24;
    		dy--;	
    	}
    	if(dy < 0){
    		dy = (dy+daysinmnth)%daysinmnth;
    		mnth--;	
    	}
    	if(mnth < 0){
    		mnth = (mnth+12)%12;
    		yr--;
    	}	
    	var sectext = " Seconds ";
    	var mintext = " Minutes, and ";
    	var hrtext = " Hours, ";
    	var dytext = " Days, ";
    	var mnthtext = " Months, ";
    	var yrtext = " Years, ";
    	if (yr == 1)
    		yrtext = " Year, ";
    	if (mnth == 1)
    		mnthtext = " Month, ";
    	if (dy == 1)
    		dytext = " Day, ";
    	if (hr == 1)
    		hrtext = " Hour, ";
    	if (min == 1)
    		mintext = " Minute, and ";
    	if (sec == 1)
    		sectext = " second ";
    if(now >= end){
    		document.getElementById("timeleft").innerHTML = endtext;
    		clearTimeout(timerID);
    	}
    	else{
    	//alert(now.getHours()+1);
    	document.getElementById("timeleft").innerHTML =min + ":" + sec;
    	//document.getElementById("timeleft").innerHTML = dy + dytext + hr + ":" + min + ":" + sec;
    	}
    	timerID = setTimeout("timeleft()", 1000); 
    }
    window.onload = timeleft;

  • #2
    Regular Coder hdewantara's Avatar
    Join Date
    Aug 2009
    Location
    Jakarta, Indonesia.
    Posts
    375
    Thanks
    9
    Thanked 55 Times in 54 Posts
    Hi,
    And the problem is <span id="timerleft"> isn't ticking, or the $bid['createtime'] itself is ticking and you want to synchronize <span id="timerleft"> to it? Please elaborate...


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •