Solved

Timer on WebPage

Posted on 2000-04-18
12
229 Views
Last Modified: 2013-12-16
How can display or run a timer with current date and time?without refreshing the page the should run?
0
Comment
Question by:dharan_p
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 3
  • 2
  • +1
12 Comments
 
LVL 4

Expert Comment

by:jkunal
ID: 2725918
not possible.
0
 
LVL 10

Accepted Solution

by:
makerp earned 100 total points
ID: 2725958
use javascript on the client .. this is cool. you could use a div or layer to display the time if you wish

<HTML>
<HEAD>
<TITLE> Date and Time </TITLE>
</HEAD>
<head>

<script>
// Global variables for timer.
var timerID = null;
var timerRunning = false;
var timevalue;

function startclock ()
   {
   // Make sure the clock is stopped
   stopclock();
   time();
   }

function stopclock ()
   {
   if(timerRunning)
      clearTimeout(timerID);
   timerRunning = false;
   }

function time ()
   {
   var now = new Date();
   var ampm = (now.getHours() >= 12) ? " P.M." : " A.M."
   var hours = now.getHours();
   hours = ((hours > 12) ? hours - 12 : hours);
   var minutes = ((now.getMinutes() < 10) ? ":0" : ":") + now.getMinutes();
   var seconds = ((now.getSeconds() < 10) ? ":0" : ":") + now.getSeconds();

   timevalue =(" " + hours + minutes + seconds + " " + ampm);
   // displays the current time.
   document.forms[0].local.value = timevalue;

   timerid = setTimeout("time()",1000);
   timerrunning = true;
   }
document.write(timevalue);
</script>
</head>
<body onload="startclock ()">
</center>
        <script>
       
        var now = new Date()
        var sec = now.getSeconds()
   
function MakeArray(n) {
        this.length = n;
        for (var i = 1; i <= n; i++) {
                this[i] = 0 }
            return this        
     }
     // end script -->
      </script>
   
<form>
<table width=180><tr>
<td>
 <input type="text" name="local" size=12 value=""></td><td align=left>
</td></tr></table><p>
</form>

<LAYER id=timelayer>
      
</LAYER>

</body>
</html>

</BODY>
</HTML>
0
 
LVL 4

Expert Comment

by:fruey
ID: 2725964
This is possible, but not using just ASP

Using Javascript you can get the current users' date and time, that is to say the *local* time for that user.

If their system clock is wrong, it looks bad on your own code, which is why it's not often a good option.

However, I did get something working where the time is set by ASP and then sent to Javascript, parsed, and then "javascript time" can be correct whatever the users' settings are.

Structure of the code:

Get the time via ASP
- this will be your server's system time

Parse this into a Javascript new date() variable (as the ASP time returned is a text string)

Set up a form element (usually a text input box) which can be updated dynamically via Javascript

Set a timer in javascript to update it each minute / second / whatever

Note that the time will always be your server's local time, and therefore your server has to have the correct time :)

You want to see some examples of code for all that? hmmmm

I developed a (non dynamic for the moment) code that also shows internet time (@time) and local times in several timezones, plus local time (users system) using a combination of ASP and Javascript. But I'd be reluctant to just give it away for 100 points, especially not to everyone. Persuade me.
0
WordPress Tutorial 4: Recommended Plugins

Now that you have WordPress installed, understand the interface, and know how to install new parts, let’s take a look at our recommended plugins.

 
LVL 10

Expert Comment

by:makerp
ID: 2725969
that code i posted .. im just tidying it up and getting it to diplay date aswell
0
 
LVL 1

Expert Comment

by:BaneBane
ID: 2725970
Well actually it is possible, you can use javascript.

what you might want to do is create a <div> element give it an ID. say <div id="d1">.

using javascript code, which you can start at the on_load, use the method setTimeout(SOME_FUNCTION,TIME_IN_Msec_TO_REFRESH);

this method will go to sleep and wake up at the specified time to run a function.

the function called should change the innerHTML of the div element to show the new time.

changing the innerHTML does not cause thepage to reload and so you get a clock.

Hope this helps.
0
 
LVL 4

Expert Comment

by:fruey
ID: 2725979
Makerp again quick on the draw :-)

Using makerp's script you've got the javascript part covered... Just use a bit of ASP to make the time correct (and not just local time) and you're guaranteed to be accurate (my webserver is accurate to drift of less than 1/10 second per year)...

BTW makerp - what does the function MakeArray do? You don't call it anywhere...

0
 
LVL 10

Expert Comment

by:makerp
ID: 2725985
a bit tydier ... :)

<HTML>
<head>

<script>
// Global variables for timer.
var timerID = null;
var timerRunning = false;
var timevalue;

function startclock ()
   {
   // Make sure the clock is stopped
   stopclock();
   time();
   }

function stopclock ()
   {
   if(timerRunning)
      clearTimeout(timerID);
   timerRunning = false;
   }

function time ()
   {
   var now = new Date();
   var ampm = (now.getHours() >= 12) ? " P.M." : " A.M."
   var hours = now.getHours();
   hours = ((hours > 12) ? hours - 12 : hours);
   var minutes = ((now.getMinutes() < 10) ? ":0" : ":") + now.getMinutes();
   var seconds = ((now.getSeconds() < 10) ? ":0" : ":") + now.getSeconds();

   timevalue = now.getDate() + "/" + (now.getMonth() + 1) + "/" + now.getYear() + " " + hours + minutes + seconds + " " + ampm;
   // displays the current time.
   document.forms[0].local.value = timevalue;
   timerid = setTimeout("time()",1000);
   timerrunning = true;
   }
</script>
</head>
<body onload="startclock ()">
       
<form>
 <input type="text" name="local" size=30 value="">
</form>
0
 
LVL 10

Expert Comment

by:makerp
ID: 2725987
its a scrappy bit of code in my first post ..

MakeArray serves no purpose what so ever
0
 
LVL 10

Expert Comment

by:makerp
ID: 2725992
you best using just javascript to get the time as then your page will be independant and will show the correct time where ever in the world as it will be taken from the client not server

:)
0
 
LVL 10

Expert Comment

by:makerp
ID: 2726011
getting the time in asp will be no good as it will be incorrecct by the time it reaches the client.

asp inserts the current time into a javascript var.
(its then a static time)

it then spends 30 secs getting to the client over the net..

wrong time.

if the client cannt set there clock on there pc right then they shouldnt have one and maybe should go out and buy an 'tomy , my first computer' complete with 65 spelling excercises and hang man
0
 
LVL 4

Expert Comment

by:jkunal
ID: 2726024
I am sorry i should have said not possible using asp.
0
 
LVL 4

Expert Comment

by:fruey
ID: 2726262
Yep makerp, you're right. By the time it gets to the client it's a few seconds out, but

1) IT's better than the average users' clock in my experience, especially where I live (Morocco)

2) You can get the timezone offset from Javascript and change your ASP time accordingly, or calculate the time offset between your server and your target audience and label your time "New York" or "Casablanca"

but generally I agree.. As long as you're happy that users can set their clock right. But did you know the average clock drift of a cheap PC clock chip can be up to several seconds A DAY which means even with transmission delays the time served by ASP (given that my server time is definitely accurate) will be better...

:-)
0

Featured Post

WordPress Tutorial 4: Recommended Plugins

Now that you have WordPress installed, understand the interface, and know how to install new parts, let’s take a look at our recommended plugins.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I have helped a lot of people on EE with their coding sources and have enjoyed near about every minute of it. Sometimes it can get a little tedious but it is always a challenge and the one thing that I always say is:   The Exchange of informatio…
This demonstration started out as a follow up to some recently posted questions on the subject of logging in: http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_28634665.html and http://www.experts-exchange.com/Programming/…
The purpose of this video is to demonstrate how to automatically show related posts at the bottom of a blog post in WordPress. This will be demonstrated using a Windows 8 PC. Plugin “Yet Another Related Posts Plugin” will be used. Go to your…
The purpose of this video is to demonstrate how to integrate Mailchimp with Facebook. This will be demonstrated using a Windows 8 PC. Mailchimp and Facebook will be used. Log into your Mailchimp account. : Click on your name. Go to Account Setti…

630 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question