Time Basics - Form computes time and displays output?

[Dan]

Question on how to do this.

I'm trying to make a script that has 3 text fields in a form. When a
start time is entered in a text field in the form the other 2 fields
display the time with a set amount of hours and minutes added.


Example:

Text Box 1 - I enter Start Time
Text box 2 - Text Box 1 + 4 hrs 30 min.
Text box 3 - Text Box 1 + 9 hrs 30 min.

I started with this basic script but can't even get the time portion
to add correctly.

<SCRIPT LANGUAGE ="JavaScript">
function multiplyTheFields()
{
var number_one =window.document.the_form.field_one.value;
var number_two =window.document.the_form.field_two.value;
var product= number_one + '4:30';
window.document.the_form.timea.value = product;

}
</SCRIPT>


<Form name ="the_form">
<Input type = "text" name = "field_one" onchange =
"multiplyTheFields(); return false"><BR>
<Input type = "text" name = "field_two"><BR>
Answer <Input type = "text" name = "timea"><BR>
</FORM>

Thanks for any help, Dan

 

[RobG]

Question on how to do this.

I'm trying to make a script that has 3 text fields in a form. When a
start time is entered in a text field in the form the other 2 fields
display the time with a set amount of hours and minutes added.

[...]

This code below should get you started. Note that you should
thoroughly validate input to ensure it is of the correct format.

You may also want to format the output to add leading zeros for single
digit numbers. If the two "output" inputs are purely for output, you
may want to make them readonly or use normal <span> or <div> elements
to present the output. People tend to want to put something into input
fields, whereas if the output is just text, they don't.

--
Rob
<script type="text/javascript">
function addTimes(a,b,c) {
if (a.value != '') {
/* Validate input here to check time entered is
of correct hh:mm format and within required range
Handle error if is isn't
*/
}
var t0 = a.value.split(':');
var t1 = b.value.split(':');
var t2 = c.value.split(':');

var m1 = +t0[1] + +t1[1];
var h1 = +t0[0] + +t1[0] + Math.floor(m1/60);
m1 = (m1 % 60);
b.value = h1 + ':' + m1;

var m2 = +t0[1] + +t2[1];
var h2 = +t0[0] + +t2[0] + Math.floor(m2/60);
m2 = (m2 % 60);
c.value = h2 + ':' + m2;
}
</script>
<form action="">
<label for="inTime">Enter time 0:
<input type="text" name="inTime"
onblur="addTimes(this,this.form.time1,
this.form.time2)"></label>
<label for="inTime">Time 1 (add 1:30):
<input type="text" name="time1" value="1:30"></label>
<label for="inTime">Time 2 (add 3:15):
<input type="text" name="time2" value="3:15"></label>
<br>
<input type="reset">
</form>

 

[Dr John Stockton]

JRS: In article <[email protected]>,
dated Wed, 24 Nov 2004 18:43:00, seen in Dan

I'm trying to make a script that has 3 text fields in a form. When a
start time is entered in a text field in the form the other 2 fields
display the time with a set amount of hours and minutes added.

You will need[*] to decompose the text strings into hours and minutes
numbers.

It is then possible to add as you may have been taught at school - add
the minutes, and if necessary carry into the hours.

It is cleaner to convert all times into a count of a base unit, such as
of minutes, to do arithmetic with them, and (using a function) to
convert back :-
MinsCount = HourString*60 + +MinsString
....
HourString = LZ((MinsCount/60)|0)
MinsString = LZ(MinsCount * 60)

where LZ is a Leading Zero function such as
function LZ(x) { return (x<0||x>=10?"":"0") + x }

var number_one =window.document.the_form.field_one.value;
var number_two =window.document.the_form.field_two.value;
var product= number_one + '4:30';

Those are strings; you should get string addition, which is
concatenation. For javascript to know that you are dealing with dates,
you need to use its date functions; but that is not in this case
necessary.


[*] But not inevitably :

T0 = "2:45"
T1 = "1:23"

A = "1970/01/01 " ; Z = "Z"

D = +new Date(A+T0+Z) + +new Date(A+T1+Z) // time_t, ms
D = new Date(D)
D = String(D).match(/\d\d:\d\d/)

gives 04:08 . It wraps at 24h, but by using a subtler RegExp one
could get days up to 30.

 

[Dan]

Thank you gentlemen,

Great help! I wasn't in the right area but now I understand.

Dan