The tutorial:
Digg this, Post to del.icio.us,
Save time for your self, and let javascript give you the current time.
We have a customer that enters lots of articles through a form, and one of the fields are a date/time when the auction is to start. To speed up their work I created a handy function that fills the input field with the current date/time.
Lets set the id of the input field to "startWhen", by writing this: <input type="text" id="startWhen" />
This way we can access that field with this function: document.getElementById("startWhen")
Let's assign the result from that function as the variable "theInput".
The variable has a number of different attributes and the most important for us right now is .value, which holds the text that is displayed in the field.
Ok, let's look at the "action... the javascript function: "setStartTimeNow()".
Basicly we get a "date-object" like this: var d = new Date();
That object have lots of functions for getting the different variables like year, month, hour etc.
Important for us (that made me rub my head a little...) is that the function getMonth() returns a number between 0 and 11, where 0 is january and 11 is december.
So I add 1 to the the month, so we get the "normal" way to write month...
Because I live in Sweden I write the date/time like this: 2006-06-04 23:19.
Feel free to change around with the formatting if you need to.
There is some more "magic" to get the format good looking.
Numbers less than 10 are returned without a leading zero, but I like to have a leading zero for the format.
So this short way to write a if makes sure that numbers lover than 10 get's a zero infront of the number: (currMonth < 10 ? "0" : "")
I now create a link that activates the javascript function: <a href="http://www.999tutorials.com/item.php#" onclick="setStartTimeNow()">Set current time</a>
It's called by using the "onclick" event.
Good luck and remember that javascript can be a really good way to help your visitors.
Below are the javascript and html, so you don't have to write anything at all by your self :-) The javascript function: <script language="JavaScript">
function setStartTimeNow()
{
var d = new Date();
var currYear = d.getFullYear();
var currMonth = d.getMonth() + 1;
var currDate = d.getDate();
var currHour = d.getHours();
var currMin = d.getMinutes();
time = currYear + "-" +
(currMonth < 10 ? "0" : "") + currMonth + "-" +
(currDate < 10 ? "0" : "") + currDate + " " +
(currHour < 10 ? "0" : "") + currHour + ":" +
(currMin < 10 ? "0" : "") + currMin;
theInput = document.getElementById("startWhen");
theInput.value = time;
}
</script> |
The html form:
<form>
Start time: <input type="text" id="startWhen" />
<a href="http://www.999tutorials.com/item.php#" onclick="setStartTimeNow()">Set current time</a>
</form> |
Digg this, Post to del.icio.us,
|
Use javascript to fill an input field with the current date/time to save time for your self. A handy function with complete code and html to copy paste
