simple math calculations in text field

peach255 · Jun 2, 2003

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!

EdwardMartinIII · Jun 2, 2003

Basically, you want to tie the sum function to LostFocus events of each of the addends. That way, if you change either one, clicking away will cause the summation to occur.

Are these date values, then? What sort of text do you expect the Users to input?

Cheers,

[monkey]

Edward

"Cut a hole in the door. Hang a flap. Criminy, why didn't I think of this earlier?!" -- inventor of the cat door

peach255 · Jun 3, 2003

Thank you for your reply. The values expected are currency ... ex. 125.25 . Is there somewhere you can point me to get the syntax for having a sum function to a LostFocus event on each of the addends? Thank you!

EdwardMartinIII · Jun 3, 2003

"LostFocus"... Sheesh, what was I thinkin'?

The actual event is "onblur"

Is this the sort of thing you're looking for?

Code:

<!DOCTYPE html 
     PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot;
     &quot;[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;>[/URL]

<html xmlns=&quot;[URL unfurl="true"]http://www.w3.org/1999/xhtml&quot;[/URL] xml:lang=&quot;en&quot; lang=&quot;en&quot;>
  <head>
    <meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=iso-8859-1&quot;></meta>
    <title>JavaScript Sample</title>
  </head>
  <body>
    <form name=&quot;MainForm&quot;>
      <p>How many dollars do you owe me: $<input type=&quot;text&quot; id=&quot;MeDollars&quot; value=&quot;0&quot; onBlur=&quot;MainForm.TotalDollars.value=parseFloat(MainForm.MeDollars.value)+parseFloat(MainForm.HerDollars.value);return true;&quot;></input><br />
      How many dollars do you owe my sister: $<input type=&quot;text&quot; id=&quot;HerDollars&quot; value=&quot;0&quot; onBlur=&quot;MainForm.TotalDollars.value=parseFloat(MainForm.MeDollars.value)+parseFloat(MainForm.HerDollars.value);return true;&quot;></input></p>
      <p>How much you owe our family: $<input type=&quot;text&quot; id=&quot;TotalDollars&quot; value=&quot;0&quot; disabled=&quot;disabled&quot; onfocus=&quot;MainForm.TotalDollars.blur();return false;&quot;></input></p>
      <p>Have a nice day.</p>
    </form>
  </body>
</html>

Cheers,

Edward

"Cut a hole in the door. Hang a flap. Criminy, why didn't I think of this earlier?!" -- inventor of the cat door

dbMark · Jun 3, 2003

You may have to do at least one modification to your code.

When you use parseInt, it is wise to use the second parameter or "radix", such as 10 for the decimal system. If you don't you may get unexpected results. Without that second parameter, for example, parseInt(000123) is NOT 123, but calculated in base OCTAL. So use:

Code:

var vAirRail1 = parseInt(document.all.ar_date1.value,10);

parseInt() is different from parseFloat(). In this usage they both work fine, almost interchangeably.

See these posts for similar hints helpful to others.
thread216-557502
thread216-558418

peach255 · Jun 3, 2003

Thank you for all of your help! I also find out I can do "onChange" as well for each of the fields, so that when the user puts in a value and tab away from the text field, the onChange will call a function that does the addition of all of the fields.
Thanks!!!

EdwardMartinIII · Jun 4, 2003

Peach,

Note that onChange will only trigger if the value is changed while they're there. If they don't change it, nothing happens. onBlur happens every time they step away from the vehicle, regardless of what they might or might not have changed.

Just in case it matters.

Cheers,

[monkey]

Edward

"Cut a hole in the door. Hang a flap. Criminy, why didn't I think of this earlier?!" -- inventor of the cat door

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

simple math calculations in text field

peach255

Programmer

EdwardMartinIII

Technical User

peach255

Programmer

EdwardMartinIII

Technical User

dbMark

Programmer

peach255

Programmer

EdwardMartinIII

Technical User

Similar threads

Part and Inventory Search

Sponsor