add field values on a form

[crimmelcp]

How do you add field values on a form

field1 + field2 = field 3

when I change field 1 or 2 then field 3 changes

Thanks
Charlie Crimmel

 

[tsdragon]

The simple part is"

document.forms['[i]formname[/i]'].elements['field3'].value = document.forms['[i]formname[/i]'].elements['field3'].value + document.forms['[i]formname[/i]'].elements['field3'].value;

When do you want this calculation to take place? When you change either field? When you click a button? When you change a field and move to another field?


Tracy Dryden

Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.

 

[tsdragon]

STUPID! That's what I get for cutting and pasting! The above should read:

document.forms['formname'].elements['field3'].value = document.forms['formname'].elements['field1'].value + document.forms['formname'].elements['field2'].value;

I forgot to change the field names after I pasted.


Tracy Dryden

Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.

 

[kaht]

Don't forget to use parseInt to ensure the numbers don't become concatenated strings. (assuming you're adding 2 numbers)

-kaht

...looks like you don't have a job, so why don't you get out there and feed Tina.

 

[crimmelcp]

Yes I am adding 2 numbers and I need this to happen whenever I change one of the numbers.

Charlie Crimmel

 

[crimmelcp]

This is the code that I am trying to use, but I cannot get the form to refresh to tell if this code is working.

Charlie Crimmel

<SCRIPT LANGUAGE="JavaScript">
function CF_add_holiday
{
document.forms['Staff_Time'].elements['tot_holiday'].value = 
document.forms['Staff_Time'].elements['HSM1'].value + document.forms['Staff_Time'].elements['HSTU1'].value +
document.forms['Staff_Time'].elements['HSW1'].value + document.forms['Staff_Time'].elements['HSTH1'].value +
document.forms['Staff_Time'].elements['HSF1'].value ;
}
</script>

 

[tsuji]

crimmekp,

But you have taken the advice on parseInt, or more flexibly parseFloat. Further, the adding up must be triggered by some event, onblur event would be appropriate. Let's say the page has this structure.
[tt]
<form name="frmtest">
<input type="text" name="field1" onblur="update()" />
<input type="text" name="field2" onblur="update()" />
<input type="text" name="field3" disabled="disabled" />
</form>
[/tt]
And the update() is function in the header section.
[tt]
function update() {
document.frmtest.field3.value=parseFloat(document.frmtest.field1.value)+parseFloat(document.frmtest.field2.value);
}
[/tt]
The place CF_add_holiday[red]()[/red] takes up my update() demo shown. Use forms[], elements[] as suggested if you think desirable. (Furthermore, you know, parseInt or parseFloat of 12abc gives you 12 despite abc.)

regards - tsuji

 

[crimmelcp]

This is the update script that I am using now
Does this code look ok?
It is still not working, but I will post the onblur part after this.

Charlie Crimmel

<SCRIPT LANGUAGE="JavaScript">
function CF_add_holiday()
document.Staff_Time.tot_holiday.value = 
parseFloat(document.Staff_Time.HSM1.value) + 
parseFloat(document.Staff_Time.HSTU1.value) +
parseFloat(document.Staff_Time.HSW1.value) + 
parseFloat(document.Staff_Time.HSTH1.value) +
parseFloat(document.Staff_Time.HSF1.value) ;
</script>

 

[crimmelcp]

this is the on blur code.
the the total field is not updating.
does this code look ok?
Tharlie Crimmel

    <td width="1"> <CFInput name="HSM1" type = "text" size="1" value="0.00" onblur="CF_add_holiday()"></td>
      <td>&nbsp;</td>
    <td width="1"> <CFInput name="HSTU1" type = "text" size="1" value="0.00" onblur="CF_add_holiday()"></td>
      <td>&nbsp;</td>
    <td width="1"> <CFInput name="HSW1" type = "text" size="1" value="0.00" onblur="CF_add_holiday()"></td>
      <td>&nbsp;</td>
    <td width="1"> <CFInput name="HSTH1" type = "text" size="1" value="0.00" onblur="CF_add_holiday()"></td>
      <td>&nbsp;</td>
    <td width="1"> <CFInput name="HSF1" type = "text" size="1" value="0.00" onblur="CF_add_holiday()"></td>
      <td>&nbsp;</td>
	  <td>&nbsp;</td>
      <td>&nbsp;</td>
	  <td>&nbsp;</td>
      <td>&nbsp;</td>
      <td width="1"> <CFInput name="tot_holiday" type = "text" size="1" value="0.00" ></td>

 

[tsuji]

It looks right.
- tsuji

 

[tsuji]

My post meant for the part only. I post the same time as you. (But, now it looks like coldfusion thing? That I cannot be sure.)
- tsuji

 

[tsuji]

crimmelcp,

It does not look right after all. You need { } enclosing the function's statements.

- tsuji

 

[crimmelcp]

I put the {} aroung the function

same result

Charlie Crimmel

 

[crimmelcp]

can someone send me an working example so I can figure this out.
Thanks
Charlie Crimmel
ccrimmel@bluestarentp.com

 

[tsuji]

This is my demo, or as you say working version. Nothing magic. I hope you get the curly bracket position right---I shouldn't say!
[tt]
<html>
<head>
<script language="javascript">
function update() {
document.frmtest.field3.value=parseFloat(document.frmtest.field1.value)+parseFloat(document.frmtest.field2.value);
}
</script>
<body>
<form name="frmtest">
<input type="text" name="field1" onblur="update()" />
<input type="text" name="field2" onblur="update()" />
<input type="text" name="field3" disabled="disabled" />
</form>
</body>
</html>
[/tt]
- tsuji

 

[crimmelcp]

I got it working. Thank You
I was missing the () after the function
working code

<SCRIPT LANGUAGE="JavaScript">
function CF_add_holiday(){
document.forms[0].tot_holiday.value = 
parseFloat(document.forms[0].HSM1.value) +
parseFloat(document.forms[0].HSTU1.value) + 
parseFloat(document.forms[0].HSW1.value) +  
parseFloat(document.forms[0].HSTH1.value) +  
parseFloat(document.forms[0].HSF1.value);
}
</script>

 

[tsuji]

Glad you get it. I just want to note a missing </head> in the demo I pasted. Hope that does not mislead anybody.
- tsuji

 

[Patdundee]

Hi tsuji

Just been reading your replieas and assistance on this thread.
I have a question for you relating to this topic. All the code works fine. I have a form with numerous fields with user inputed values.

Question how can we keep the result rounded off to two decimal palces so we do not end up with 3 or 4 digits after the decimal point.

The following has all been joined together to make 1 function code to be called by each field upon change and works well. The user can change any field and it will update the total field. My problem is when a user hass a quantity of 5 for one item each at 1.63 and adds to a quantity of 6 at 3.32 everything adds correctly put the decimal place goes expenetial and it does not round up or down. instead of the answer 21.07 it will give an answer of 21.0652314587

Coding
function update1() {
document.deane1.custotal.value=(parseFloat(document.deane1.qward1.value)
*parseFloat(document.deane1.qward2.value))+(parseFloat
(document.deane1.endpanel1.value)*parseFloat
(document.deane1.endpanel2.value))+(parseFloat
(document.deane1.header1.value)*parseFloat(document.deane1.header2.value))
+(parseFloat(document.deane1.windowfillet1.value)*parseFloat
(document.deane1.windowfillet2.value))+(parseFloat
(document.deane1.gothicmirror1.value)*parseFloat
(document.deane1.gothicmirror2.value))+(parseFloat
(document.deane1.tintedmirror1.value)*parseFloat
(document.deane1.tintedmirror2.value))+(parseFloat
(document.deane1.colouredglass1.value)*parseFloat
(document.deane1.colouredglass2.value))+(parseFloat
(document.deane1.paneldoors1.value)*parseFloat
(document.deane1.paneldoors2.value))+(parseFloat
(document.deane1.custshelvcharge1.value)*parseFloat
(document.deane1.custshelvcharge2.value))+(parseFloat
(document.deane1.shelfunit1.value)*parseFloat
(document.deane1.shelfunit2.value))+(parseFloat
(document.deane1.shelving1.value)*parseFloat
(document.deane1.shelving2.value))+(parseFloat
(document.deane1.drawerunit1.value)*parseFloat
(document.deane1.drawerunit2.value))+(parseFloat
(document.deane1.shelfdrawerunit1.value)*parseFloat
(document.deane1.shelfdrawerunit2.value))+(parseFloat
(document.deane1.chimbreastshelving1.value)*parseFloat
(document.deane1.chimbreastshelving2.value))+(parseFloat
(document.deane1.intcolournotwhite1.value)*parseFloat
(document.deane1.intcolournotwhite2.value))+(parseFloat
(document.deane1.wardremov1.value)*parseFloat
(document.deane1.wardremov2.value));
}

 

[BillyRayPreachersSon]

Pat,

I'd suggest asking this as a new question, as it doesn't relate to the original (adding numbers, and getting a number to 2 d.p are two very different questions).

When you do ask the new question, can you post your code in code tags (see the "Process TGML" link below the posting box), and also put some spaces in - this line doesn't wrap at all, and is very hard to follow.

Dan


[tt]D'ya think I got where I am today because I dress like Peter Pan here?[/tt]

 

[Patdundee]

Hi Dan

No matter how I process the code it always comes out the same as you see it. The code is actually one long line of script from top to bottom shown by the function update1() { and ending at the very bottom with the } at the end. There are 34 fields involved in the calculation 17 are quantity fields and 17 are value fields. I have set the code so that no matter which field the client changes it will give the total in the last field custotal.value which is shown at the start of the code. The custotal is acheived by adding the pairs of fields total eg
custotal = ((qyt1.value * cost1.value) + (qyt2.value * cost2.value)) and so on to the last field

Even using the code above and just using one set of fields and replacing the + with a *

function update() {
document.frmtest.field3.value=parseFloat(document.frmtest.field1.value)*parseFloat(document.frmtest.field2.value);
}

it is giving an exponetial answer hence the reason I posted it here. If you use the code and then have a quantity of 7 and times by the cost of 6.34, the output is 44.37999999999


Was not aware that these would be two completely different subjects/questions. Thats what comes of not having much to do with javascript functions. I normally stick with VBscript etc but occasionaly I have to intergrate the two.