HTML Help

polch05 · Joined: 02 Sep 2008 Posts: 3

Ciao,

I need to place a button on a web page that inserts the current system date/time into a textbox or date field.

I have a function that alerts on the date and time and a button that is calling that function yet fails to insert the value into the field on the HTML page.

What code I have so far:

var zdate = New Date();
function gtsDate(zdate){
alert(zdate);
}

The code I thought of adding to this function is:

document.write('<INPUT TYPE=Text NAME=SET.string1 VALUE=zdate>');

The important information:

string1 is a field that is already defined on the web page. It is a Date field that is in a macro though is plain HTML when stripped down.

What is wrong with the above code?

Cordially,
Christopher

Straystudio · Joined: 14 Apr 2008 Posts: 264 Location: Nord Italy

First of all, it must be

new Date() not New Date()

INPUT VALUE coded as VALUE=zdate simply writes zdate
To make zdate working as a JS variable (a service-word), it has to be "insulated" from the running string, by ' ' apostrophos delimiters AND chained by + sign.
So, look at how;
in place of:

document.write('<INPUT TYPE=Text NAME=SET.string1 VALUE=zdate>');

I do, also employing double quotation marks:

document.write('<INPUT TYPE="Text" NAME="SET.string1" VALUE="'+zdate+'">');

The four ' delimiters make the string starting, then getting interrupted to take variable, then re-starting and then closing on the fourth apos delimiter.

You may want to add SIZE="70" Attribute into INPUT Tag, with 70 or less as Value depending on how much long date-text You want the text-field row to display.
READONLY as well would be a good addition into the Tag.

polch05 · Joined: 02 Sep 2008 Posts: 3

Ciao,

Grazie millie.

The quotation and chaining of the js variable works. However when it populates the field string1 it opens another window and the only field on the web page is string1.

What is causing this? I require it to dynamically update the field in the same window/form.

There is already HTML code that writes out the string1 text field. Then this Javascript is just to insert a value in the field.

Any more ideas?

Cordially,
Christopher

Straystudio · Joined: 14 Apr 2008 Posts: 264 Location: Nord Italy

Ah, yes!
document.write writes HTML as a new starting Document;
to be accomplished with other HTML parts, it should be run at once on the while the whole Code gets scanned.

I should have read better, You want this to be called in play by a button triggering a function AND stay inside the launching page as its part.

It is of course called in play when the page already exists and if so, document.write takes place in place of the present HTML.
Also, triggering the function on BODY onLoad would be too later:
<body onLoad='gtsDate()'> (in body opening Tag).

To achieve Yours, document.getElementById("its_id")
driving .innerHTML or .value have to be employed.
document.getElementsByName("its_name")[i] could also be used, yet let me discuss this later.

Let me assume, now that INPUT TEXT field can exist at once when page appears; as an empty text-field or containing different a Value.
If so, simply code it as usual where it has to find its place, and just assign it an ID Code: <INPUT ID="date_field" TYPE="Text" SIZE="70" NAME="SET.string1" VALUE="" />
Now add executable JS string into Your function:
document.getElementById("date_field").value=zdate;
the SCRIPT going in the HEAD of the Document. Code:

<script type="text/javascript">

var zdate = new Date();

function gtsDate(zdate){
alert(zdate);
document.getElementById("date_field").value=zdate;
}

</script>

I am not aware on the whole layout, i see You keep the var zdate function gtsDate(zdate) in the name of the function; if so, it must be on the button as well, it or any others the variable has to be set at.
For instance, this on a button else, would pass the Day of the Week to be displayed through the function; 3 as Wednesday, on today.
ONCLICK='gtsDate(new Date().getDay());'

If there is no reason to keep it, simply write:
function gtsDate() in the SCRIPT, and onClick='gtsDate()' in the command (BUTTON).

polch05 · Joined: 02 Sep 2008 Posts: 3

Ciao,

Tutti bene. The code works very well. Thank you for your post.

I have a need now to have the value returned from the new Date(); to be in the format mm\dd\yyyy 00:00.

Do you know how to do that?

I just wanted to ask. I am going to try searching on results too.

Cordially,
Christopher

Straystudio · Joined: 14 Apr 2008 Posts: 264 Location: Nord Italy

new Date() plus some extensions, returns single parts ot the "time".
For instance, new Date().getYear() and new Date().getFullYear() both return which Year;
the first one as 108
the second as 2008

The right sintax being to translate the new Date() piece into a variable, then adding exstension to this, I'll keep Your zdate to do as well zdate.getMonth() zdate.getDay() (day of the week) and so.
Be aware, these return just numbers; so, if You wish to have Months and week-Days displaying as words, You will have to fill-in a little Array based on Language.
A sample, now more than words:
Code:
<script type="text/javascript">

months = new Array ('Gen','Feb','Mar','Apr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dec');
weekly = new Array ('Sun','Mon','The','Wed','Thu','Fri','Sat');

function gtsDate(){

var zdate = new Date();
alert(zdate);
document.getElementById("date_field").value=months[zdate.getMonth()]+', '+weekly[zdate.getDay()]+' '+zdate.getDate()+' '+zdate.getFullYear()+' '+zdate.getHours()+':'+zdate.getMinutes()+':'+zdate.getSeconds()+'';

}

</script>

Notice I moved the var zdate = new Date(); inside the function, making it a local variable, and the time will be updated on each time You push the button triggering the JS function; otherwise, keeping it outside the function as a global variable, still inside the same SCRIPT though, updating occurs on page refresh.

Large usage of ' aphos delimiters combined with + chaining signs, still to work out empty spacing-spaces and the comma after the Month.