PDA

Click to See Complete Forum and Search --> : javascript + math calculations populate on text field

peach255
06-02-2003, 04:24 PM
I have 2 text fields (ar_date1 + ar_date2) which the user has to enter some #s in. Then I would like a 3rd text field (ar_date_total) to be autocalculated and populated based on the users' input. I do not want the user to press any button for this to occur, but automatically populate when the user hit tab or move to the next field.

I am fairly new to using Javascript to calculate values. So far, I have the following code ... this does not work now.

<SCRIPT LANGUAGE="JavaScript">
function Calculate(){
var vAirRail1 = parseInt(document.all.ar_date1.value);
var vAirRail2 = parseInt(document.all.ar_date2.value);
var vAirRailTotal = AirRail1 + vAirRail2
document.all.ar_total.value = vAirRailTotal;
}
</SCRIPT>

Thank you!
Charles
06-02-2003, 04:41 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<title>Example</title>
<style type="text/css">
<!--
label {display:block}
-->
</style>
<form action="">
<div>
<label><input type="text" name="ar_date1" onchange="if (this.form.ar_date2.value.length > 0) this.form.total = parseInt(this.value) + parseInt(this.form.ar_date2)">First Field</label>
<label><input type="text" name="ar_date2" onchange="if (this.form.ar_date1.value.length > 0) this.form.total.value = parseInt(this.value) + parseInt(this.form.ar_date1.value)">Second Field</label>
<script type="text/javascript">
<!--
document.write('<label><input type="text" name="total">Total</label>');
// -->
</script>
</div>
<div><input type="submit"></div>
</form>

You will note that the "total" field is drawn by JavaScript. That's because 13% of users do not use JavaScript. This way the field will only be drawn when it does something and you will not have to suffer the embarrassment of a field that does nothing.