Jump to content

Timestamp on Button Click


ueharataichou

Recommended Posts

I'm having trouble coding a button that, when clicked, executes a php function for timestamp..I know that client-side and server-side (javascript and php) can't do that, that's why I'm here to ask for help, I totally have no idea how to do it on AJAX.  :'(

 

Again:

 

OnClick of Button1 go to function TimeStamp

 

How?  :shrug:

Link to comment
Share on other sites

You actually CAN get the current timestamp using only Javascript.  The following works:

 

function myGetTime()
{
  var d = new Date();
  return d.getTime();
}

 

 

If you want to do this with a PHP script and have it executed through AJAX it can be done...there is a great tutorial that is stickied here at the top of this forum.

 

 

But just knowing that you want to return a timestamp isn't enough (regardless of whether you use Javascript or full-blown AJAX) -- we need to know what you plan on doing with it.  For example, do you want to update the text of the button so that it changes to display the timestamp?  Do you want the timestamp to display somewhere else on the page?  Do you want a particular div tag to contain the resulting timestamp?

 

Retrieving the timestamp is easy -- now that we have it, what do we do with it?

 

Link to comment
Share on other sites

For some strange reason I can't seem to modify my old post, so I'll post a little more here.  Below is a very simply skeleton for AJAX.  If you want to get a timestamp then a simple backend PHP script (let's call it time.php) would be something like this:

 

<?php
echo time();
?>

 

 

Then your AJAX code could look something like this.  The problem is -- I don't know what you want to do inside of the stateChanged() function.  Once the readyState is 4, we know that we have received a response from the server but we don't know what to do with it yet...

 


<script type="text/javascript">
var xmlhttp;

function getTime()
{
  // create the xmlhttp object
  xmlhttp=GetXmlHttpObject();

  if (xmlhttp==null)
  {
    alert ("Your browser doesn't support AJAX or you are blocking Javascript");
    return;
  }

  // define a variable that indicates which backend PHP script we want to run
  var url="time.php";
  xmlhttp.onreadystatechange=stateChanged;
  xmlhttp.open("GET",url,true);
  xmlhttp.send(null);
}

function stateChanged()
{
  if (xmlhttp.readyState==4)
  {
    // do something here with xmlhttp.responseText -- not sure what yet
  }
}

function GetXmlHttpObject()
{
  if (window.XMLHttpRequest)
  {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    return new XMLHttpRequest();
  }
  if (window.ActiveXObject)
  {
    // code for IE6, IE5
    return new ActiveXObject("Microsoft.XMLHTTP");
  }

  return null;
}
</script>

 

 

Somewhere else in that HTML code you would have something like:

 

<input type="button" value="Click me!" onClick="getTime();">

Link to comment
Share on other sites

Ok I thought rather than give you only the AJAX code while we wait for your desired purpose -- it might be useful to give you an entire working script and then you can modify it as you see fit.  So here it is.  Just name this something like time.html and have it invoke the small PHP script I gave you above (time.php).  Cheers.

 

<html>
<head>

<script type="text/javascript">
var xmlhttp;

function getTime()
{
  // create the xmlhttp object
  xmlhttp=GetXmlHttpObject();

  if (xmlhttp==null)
  {
    alert ("Your browser doesn't support AJAX or you are blocking Javascript");
    return;
  }

  // define a variable that indicates which backend PHP script we want to run
  var url="time.php";
  xmlhttp.onreadystatechange=stateChanged;
  xmlhttp.open("GET",url,true);
  xmlhttp.send(null);
}

function stateChanged()
{
  if (xmlhttp.readyState==4)
  {
    // modify the HTML inside of the "myResponse" div tag
    document.getElementById("myResponse").innerHTML=xmlhttp.responseText;
  }
}


function GetXmlHttpObject()
{
  if (window.XMLHttpRequest)
  {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    return new XMLHttpRequest();
  }
  if (window.ActiveXObject)
  {
    // code for IE6, IE5
    return new ActiveXObject("Microsoft.XMLHTTP");
  }
  return null;
}
</script>


</head>
<body>
<input type="button" value="Click me!" onClick="getTime()">
<br><br>
<div id="myResponse">This text will change to the current timestamp</div>

<p>This text will stay the same since it's outside of the div tag</p>
</body>
</html>

 

 

Again however -- if all you want is a timestamp then use the simple Javascript from my first post.  You don't need AJAX just for a timestamp (in fact, it's just going to slow down the performace of your page because it has to make the GET request and wait for the server to respond).  But hopefully you will find the AJAX example useful anyway, for future endeavors and what not.  :)

Link to comment
Share on other sites

Javascript is the best way to get an to date time-stamp period.

 

Personally i like/love PHP but AJAX would take a bit longer and take up just a little bit of bandwidth to just run the function.  Javascript can give you the time nearly instantly.

 

Here is my javascript time-stamp script

 

function current_time_function(){

      return (Math.floor((new Date().getTime())/1000));}//shows current time in seconds // PHP its gmdate("U");

 

For me i use this function in my other script which output the data.  So you might want to replace RETURN with something like

 

document.getElementsByName('time_stamp_1').innerHTML=current_time_function();//output in <input name=time_stamp_1>

document.getElementById("div").innerHTML=current_time_function();//output in <div>

document.getElementsByTagName("input")[0].firstChild.nodeValue=current_time_function();//output in <TD>

 

slight note.  Internet explore doesnt like the .getElementsByName function, its the only issue i got with my timestamps oddly enough.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.