# JavaScript Help: Cost Savings Calculator

#### Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

•  Subject
• Author
• Posted on
cost savings I'm trying to calculate a simple cost savings problem and
I having trouble.

Check out this page.
http://mywebpages.comcast.net/surge42/costcalc.html

I've been able to get the script to add and total the "Total Monthly
I'm trying to calculate a simple cost savings problem and I having
trouble.

Check out this page.
http://mywebpages.comcast.net/surge42/costcalc.html

I've been able to get the script to add and total the "Total Monthly
Personal Costs" but I'm
having difficulty figuring out how to..

1) Get the selected monthly service fee to show up in the "Total
Service Fee Cost " list box (named TotalServiceFee_
2) Get the equation to calculate (and display) the  "Total Monthly
Savings" and the "Total Yearly Savings"

How should I approach this?
I'm stumped.

## Re: JavaScript Help: Cost Savings Calculator

Here:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd ">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<title>Untitled Document</title>

<script type="text/javascript">
<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Created by: www.jdstiles.com -->
<!-- Begin
function startCalc(){
interval = setInterval("calc()",1);
}
function calc(){
one = document.getElementById("firstBox").value;
two = document.getElementById("secondBox").value;
three = document.getElementById("thirdBox").value;
four = document.getElementById("fourthBox").value;
five = document.getElementById("fifthBox").value;
six = document.getElementById("sixthBox").value;
document.getElementById("seventhBox").value = (one * 1) + (two * 1) +
(three * 1) + (four * 1) + (five * 1) + (six * 1);
if (document.getElementById("servicefee1").checked)
fee = document.getElementById("servicefee1").value;
else if (document.getElementById("servicefee2").checked)
fee = document.getElementById("servicefee2").value;
else if (document.getElementById("servicefee3").checked)
fee = document.getElementById("servicefee3").value;
else if (document.getElementById("servicefee4").checked)
fee = document.getElementById("servicefee4").value;
else if (document.getElementById("servicefee5").checked)
fee = document.getElementById("servicefee5").value;
document.getElementById("TotalServiceFee").value = fee;
document.getElementById("TotalMonthlySavings").value =
document.getElementById("seventhBox").value + fee;
document.getElementById("TotalYearlySavings").value =
Math.round((document.getElementById("seventhBox").value + fee) * 12 *
100) / 100;
}
function stopCalc(){
clearInterval(interval);
}
//  End -->
</script>
<style type="text/css">
<!--
.style1 {font-family: Arial, Helvetica, sans-serif}
.style2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background-color: #CCCCCC;
font-weight: bold;
}
.style4 {font-family: Arial, Helvetica, sans-serif; font-weight: bold;
}
.style6 {
font-family: Arial, Helvetica, sans-serif;
color: #666666;
font-weight: bold;
}
-->
</style>
</head>

<body>

<form name="autoSumForm">
<p class="style2">Step One: Total Monthly Personal Costs </p>
<table width="50%" cellpadding="2" cellspacing="3" >
<tr>
<td width="53%" class="style1">Personal Monthly Cost One </td>
<td width="47%"><input type=text id="firstBox" name="firstBox"
value="" onFocus="startCalc();" onBlur="stopCalc();"></td>
</tr>
<tr>
<td class="style1">Personal Monthly Cost Two </td>
<td><input type=text id="secondBox" name="secondBox" value=""
onFocus="startCalc();" onBlur="stopCalc();"></td>
</tr>
<tr>
<td class="style1">Personal Monthly Cost Three </td>
<td><input type=text id="thirdBox" name="thirdBox" value=""
onFocus="startCalc();" onBlur="stopCalc();"></td>
</tr>
<tr>
<td class="style1">Personal Monthly Cost Four </td>
<td><input type=text id="fourthBox" name="fourthBox" value=""
onFocus="startCalc();" onBlur="stopCalc();"></td>
</tr>
<tr>
<td class="style1">Personal Monthly Cost Five </td>
<td><input type=text id="fifthBox" name="fifthBox" value=""
onFocus="startCalc();" onBlur="stopCalc();"></td>
</tr>
<tr>
<td class="style1">Personal Monthly Cost Six </td>
<td><input type=text id="sixthBox" name="sixthBox" value=""
onFocus="startCalc();" onBlur="stopCalc();"></td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
<p class="style2">Step Two: Select Monthly Service Fees</p>
<span class="style6">The user will select a &quot;Service Fee&quot;
and the selection will appear in the &quot;Total Service Fee Cost&quot;
below.
</span>
<table width="50%" cellpadding="2" cellspacing="3" >
<tr>
<td width="40%" class="style1">Select Service Fee 1 </td>
<td width="60%"><input name="radiobutton" id="servicefee1"
type="radio" onchange="calc()" value="155.95" checked>
\$150.95</td>
</tr>
<tr>
<td class="style1">Select Service Fee 2 </td>
<td><input name="radiobutton" id="servicefee2" type="radio"
onchange="calc()" value="160.95">
\$160.95</td>
</tr>
<tr>
<td class="style1">Select Service Fee 3 </td>
<td><input name="radiobutton" id="servicefee3" type="radio"
onchange="calc()" value="180.95">
\$180.95</td>
</tr>
<tr>
<td class="style1">Select Service Fee 4 </td>
<td><input name="radiobutton" id="servicefee4" type="radio"
onchange="calc()" value="190.95">
\$190.95</td>
</tr>
<tr>
<td class="style1">Select Service Fee 5 </td>
<td><input name="radiobutton" id="servicefee5" type="radio"
onchange="calc()" value="200.95">
\$200.95</td>
</tr>
</table>
<br>
<table width="50%" cellpadding="2" cellspacing="3" >
<tr bgcolor="#EBEBEB">
<td width="53%" class="style4">Total Personal Costs </td>
<td width="47%"><input type=text id="seventhBox"
name="seventhBox" >        </td>
</tr>
<tr bgcolor="ebebeb">
<td class="style4">Total Service Fee Cost </td>
<td><input name="TotalServiceFee" type=text id="TotalServiceFee"

</tr>
<tr bgcolor="ebebeb">
<td class="style4">Total Monthly Savings </td>
<td><input name="TotalMonthlySavings" type=text
id="TotalMonthlySavings" ></td>
</tr>
<tr bgcolor="ebebeb">
<td class="style4">Total Yearly Savings </td>
<td><input name="TotalYearlySavings" type=text
id="TotalYearlySavings" ></td>
</tr>
</table>
<br>
<br>
<br>
<p class="style6">How can I get the script to calculate Total yearly
savings?</p>
<p class="style6">Here's the equation.</p>
<table width="230" height="74" border="1" bgcolor="efefef">
<tr>
<td align="right" valign="top"><p class="style1">Total Personal
Costs<br>
-Total Service Fee Cost<br>
-----------------------------<br>
= Total Monthly Savings<br>
x 12 Total Yearly Savings
</p>
</td>
</tr>
</table>
<p>&nbsp; </p>
<p>    <br>
</p>
</form>

</body>
</html>

## Re: JavaScript Help: Cost Savings Calculator

Adam Pflug wrote:

[a bloody huge amount of HTML with no indication at all where the OP's
problem may have been]

Cheers
Richard,

now ignoring *anything* posted from groups.google as being largely
irrelevant and rarely adhering to usenet etiquette.

## Re: JavaScript Help: Cost Savings Calculator

rf wrote:

I'm very new to usenet, and am really trying to figure it out. As to
not commenting about where he went wrong... he didnt really try to
implement the parts that were missing, so I just filled them in for
him, If he understands javascript at all (which he obviously does if he
got partway there) then he ought to be able to figure out how to do the
rest based on the code I gave him which solves his problem (albeit not
as efficiently as it could), the changes were all in one place (aside
from id's added to some elements).

If you have any tips for what proper usenet etiquette looks like (or a
website I should read about it) then by all means, please refer me to
it. What I've been doing looks fine in google groups which I assumed
was all that I needed to be aware of. Perhaps this would explain why my
posts seem like they are being ignored much of the time, even though I
think I'm actually being helpful in many cases. Constructive critisim
helps alot more then just blasting me for violating rules I'm not aware
of.

## Re: JavaScript Help: Cost Savings Calculator

Adam Pflug wrote:

<snip>

You seem to have got it right this time and have made off my ignore list
:-). You have quoted the bit to which you are replying, you have included an
attribution. You did fail to trim the bits of my post that are irrelevant to
your reply (my sig. OK, it's not a proper sig, but it could have been
snipped).

Your prior post simply landed in my newsreader[1] with none of the above,
simply a "here" followed by pages of HTML. I had to search through the
thread (OK, there is only one other post) to find out what you were
referring to, and even then I did not find anything, having not bothered to
look at the source of the page the OP provided a URL for.

No, it is not. Google groups is merely a badly designed HTML interface into
usenet. Usenet is a collection of newsgroups that have nothing at all to do
with the web or HTML (well, apart from their content, that is). The only
usefull thing about google groups is that it archives usenet posts and
should only be used IMHO to search this archive.

Quite possibly. Many people here have their newsreader[1] set to
automatically disregard anything posted from google groups. Search the
archive for any post that contains "blinky" in the from field. Look at
Blinky the Shark's sig. You will see he ignores google groups but he also
kindly provides a link to a page that you should read. Here it is:
http://blinkynet.net/comp/uip5.html

Use google groups for what it was originally designed for. Search the
archive for this group for posts with google groups in them. You will see a
pattern emerging.

[1] You would be far better off obtaining yourself a real newsreader (you
probably already have one, Outlook Express will even do for starters) and
point it to your ISP's news server, or one of the other free news servers
out there (search the archive). That way you will be accessing usenet
directly instead of via the ever to be damned google groups interface, and
you will be seen by the people mentioned above, and you won't have to jump
through hoops to make your post acceptable. Good luck :-)

Cheers
Richard.

## Re: JavaScript Help: Cost Savings Calculator

On 1 Oct 2005 03:08:02 -0700, Adam Pflug wrote:

Yes and here is how you should do it:
http://www.safalra.com/special/googlegroupsreply /

## Re: JavaScript Help: Cost Savings Calculator

Obvious wrote:

Read and noted, thanks alot :)
I'm new and I'm trying to learn...

## Re: JavaScript Help: Cost Savings Calculator

Thanks very much Adam!

wrote: