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!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

sum of txt fields in form 1

Status
Not open for further replies.

cr84net2

Programmer
Feb 8, 2005
93
US
I am not very familiar with javascript so I am piecing this together based on what I can find doing google searches.

I need to get the total of an input value multiplied by a specific number for the fields that are above one another in the code below. This is working fine. I then need to get the sum of all of the totals in to one field. I hope that makes sense. I have tried about ten different ways of doing this with no luck. The code below shows my most recent attempt.

Any help would be greatly appreciated.

Code:
<Head>

<script type="text/javascript">

 function onlyNumbers(e)
{
var keynum;
var keychar;
var numcheck;
 
if(window.event) // IE
  {
  keynum = e.keyCode;
  }
else if(e.which) // Netscape/Firefox/Opera
  {
  keynum = e.which;
  }
if(keynum==8) { 'if key is backspace
return true;'allow it
}
keychar = String.fromCharCode(keynum);
numcheck = /\d/;
return numcheck.test(keychar);
}

 function updatesum() {
 amt5 = document.getElementById('text1').value=(parseFloat(this.value)*5); 
 amt10 = document.getElementById('text3').value=(parseFloat(this.value)*10);
 amt20 = document.getElementById('text5').value=(parseFloat(this.value)*20);
 amt25 = document.getElementById('text7').value=(parseFloat(this.value)*25);
 amt50 = document.getElementById('text9').value=(parseFloat(this.value)*50);
amt100 = document.getElementById('text11').value=(parseFloat(this.value)*100);

document.CCGCform.total.value = (amt5 * 1) + (amt10 * 1) + (amt20 * 1) + (amt25 * 1) + (amt50 * 1) + (amt100 * 1);
 }
</script>
</head>

<body>

<table border="1" width="100%" >
  <tr>
    <td align="center">&nbsp;</td>
  </tr>
  <tr>
    <td align="center" valign="top" width="13%">
    
    <Form name="CCGCform" method="Post" action="ccgc.asp" >
    <table border="1" width="77%" >
      <tr>
        <td width="11%" align="center" bgcolor="#F0FFFF"><b>$5.00</b></td>
        <td width="11%" align="center" bgcolor="#F5F5F5"><b>$10.00</b></td>
        <td width="11%" align="center" bgcolor="#F5FFEC"><b>$20.00</b></td>
        <td width="11%" align="center" bgcolor="#F5FFEC"><b>$25.00</b></td>
        <td width="11%" align="center" bgcolor="#FFFCE6"><b>$50.00</b></td>
        <td width="11%" align="center" bgcolor="#F0F1FF"><b>$100.00</b></td>
        <td width="11%" align="center" bgcolor="#F0F1FF" rowspan="2">&nbsp;</td>
      </tr>
      <tr>
        <td width="11%" align="center" bgcolor="#F0FFFF"><input type="text" name="amt5" size="5" id="text1" onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text2').value=(parseFloat(this.value)*5);"></td>
        <td width="11%" align="center" bgcolor="#F5F5F5"><input type="text" name="amt10" size="5" id="text3" onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text4').value=(parseFloat(this.value)*10);"></td>
        <td width="11%" align="center" bgcolor="#F5FFEC"><input type="text" name="amt20" size="5" id="text5" onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text6').value=(parseFloat(this.value)*20);"></td>
        <td width="11%" align="center" bgcolor="#F5FFEC"><input type="text" name="amt25" size="5" id="text7" onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text8').value=(parseFloat(this.value)*25);"></td>
        <td width="11%" align="center" bgcolor="#FFFCE6"><input type="text" name="amt50" size="5" id="text9" onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text10').value=(parseFloat(this.value)*50);"></td>
        <td width="11%" align="center" bgcolor="#F0F1FF"><input type="text" name="amt100" size="5" id="text11" onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text12').value=(parseFloat(this.value)*100);"></td>
        
      </tr>
      <tr>
        <td width="11%" align="center" bgcolor="#F0FFFF"><input type="text" name="amt5total" size="5" id="text2"  onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text1').value=(parseFloat(this.value)/5);"></td>
        <td width="11%" align="center" bgcolor="#F5F5F5"><input type="text" name="amt10total" size="5" id="text4"  onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text3').value=(parseFloat(this.value)/10);"></td>
        <td width="11%" align="center" bgcolor="#F5FFEC"><input type="text" name="amt20total" size="5" id="text6"  onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text5').value=(parseFloat(this.value)/20);"></td>
        <td width="11%" align="center" bgcolor="#F5FFEC"><input type="text" name="amt25total" size="5" id="text8"  onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text7').value=(parseFloat(this.value)/25);"></td>
        <td width="11%" align="center" bgcolor="#FFFCE6"><input type="text" name="amt50total" size="5" id="text10"  onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text9').value=(parseFloat(this.value)/50);"></td>
        <td width="11%" align="center" bgcolor="#F0F1FF"><input type="text" name="amt100total" size="5" id="text12"  onkeydown="return onlyNumbers(event)" onkeyup="document.getElementById('text11').value=(parseFloat(this.value)/100);"></td>
        <td width="11%" align="center" ><input type=text name="total" size="5"><br><input type=button name=add value=calculate onClick="updatesum()">
      </tr>
    </table>
    </FORM>

Thanks for taking a look.
 
Hi

First, try to not mix JavaScript and VBScript syntax.
Code:
if (keynum==8) { [red]//[/red] if key is backspace
  return true; [red]//[/red] allow it
}
Second, in the updatesum() function the [tt]this[/tt] is a reference to the [tt]window[/tt] object. But not needed anyway. This is enough :
Code:
function updatesum()
{
  amt5 = document.getElementById('text1').value
  amt10 = document.getElementById('text3').value
  amt20 = document.getElementById('text5').value
  amt25 = document.getElementById('text7').value
  amt50 = document.getElementById('text9').value
  amt100 = document.getElementById('text11').value

  document.CCGCform.total.value = (amt5 * 1) + (amt10 * 1) + (amt20 * 1) + (amt25 * 1) + (amt50 * 1) + (amt100 * 1);
}
But to be sure it works correctly in all circumstances :
Code:
function updatesum()
{
  amt5 = [red]parseFloat([/red]document.getElementById('text1').value[red])[/red]
  amt10 = [red]parseFloat([/red]document.getElementById('text3').value[red])[/red]
  amt20 = [red]parseFloat([/red]document.getElementById('text5').value[red])[/red]
  amt25 = [red]parseFloat([/red]document.getElementById('text7').value[red])[/red]
  amt50 = [red]parseFloat([/red]document.getElementById('text9').value[red])[/red]
  amt100 = [red]parseFloat([/red]document.getElementById('text11').value[red])[/red]

  document.CCGCform.total.value = (amt5 * 1) + (amt10 * 1) + (amt20 * 1) + (amt25 * 1) + (amt50 * 1) + (amt100 * 1);
}


Feherke.
 
Thanks Feherke,

Your advice all worked well, I found out I was also adding the wrong fields, it should have been text2, text4,text6 etc.

I cannot calculate the fields without filling each field in, If i try I get NaN. Is there a way to do this with varying fields empty and still calculate the sum?

Thank you so much for the help, i was getting a bruised forehead from banging my head against the wall.
 
Thanks Feherke,

That worked perfectly! Thanks again for all of your help, I truly appreciate it.

 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top