Ok, I am such a nOOb at Java, it is not even funny (as in this is my first attempt) I have gotten this far, but I cant seem to make multiple scripts run or add up on the bottom. Can anybody please help? Here is my current script.
thanks!
</SCRIPT>
</HEAD><SCRIPT language = JavaScript>
function calculate() {
A = document.frmOne.txtFirstNumber1.value
B = document.frmOne.txtSecondNumber1.value
C = (A * B)
document.frmOne.txtThirdNumber1.value = C
}
</SCRIPT>
<SCRIPT language = JavaScript>
function calculate() {
A = document.frmOne.txtFirstNumber2.value
B = document.frmOne.txtSecondNumber2.value
C = (A * B)
document.frmOne.txtThirdNumber2.value = C
}
</SCRIPT>
<BODY>
<P><FONT SIZE="+2">F.O.C.U.S. Life Insurance Calculator</FONT></P>
<table width="750" border="2" cellpadding="2">
<tr>
<td width="169"><font size="+3">F</font> – Funeral Expenses:</td>
<td width="246"><input type=TEXT name="input_A" size=25></td>
<td width="305"><font size="2">Flowers, Burial Plots, Caskets, Professional and Transportation Services, Food, Airfare, and Others. Typically, the average funeral in the US is between ,000 – ,000. </font></td>
</tr>
<tr>
<td><font size="+3">O </font>- Other Debts:</td>
<td><input type=TEXT name="input_B" size=25
></td>
<td><font size="2">Other Debts: Mortgages, Vehicle Loans, Credit Cards and other fiduciary responsibilities.</font></td>
</tr>
<tr>
<td><font size="+3">C </font>- College </td>
<td><FORM NAME = frmOne>
<p>Number of Children
<select name="txtFirstNumber1" id="txtFirstNumber1">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</p>
<p>Type of College
<select name="txtSecondNumber1" id="txtSecondNumber1">
<option value="40000">Public/,000 per year</option>
<option value="100000">Private/,000 per year</option>
</select>
</p>
<P>
<input type = Button name = b1 value = "Add Numbers" onClick = calculate()>
<P>
<input type = Text name = txtThirdNumber1 size = 25 value = "">
</FORM></td>
<td><table cellspacing="0" cellpadding="0">
<td colspan="8" height="32" width="515"><font size="2">The average cost of a (4) year public school is ,000 per year and ,000 per year for private universities. You will want to choose the number of children you have here, if "0" leave blank.</font></td>
</table></td>
</tr>
<tr>
<td><font size="+3">U</font> – Unforeseen Expenses </td>
<td><input type=TEXT name="input_A4" size=25></td>
<td> </td>
</tr>
<tr>
<td><font size="+3">S</font> – Salary </td>
<td><div align="center">
<FORM NAME = frmTwo>
<p align="left">Salary Needed Per Year
<INPUT TYPE = Text NAME = txtFirstNumber2 SIZE = 15 value ="">
</p>
<p align="left">Number of Years
<select name="txtSecondNumber2" id="txtsecondNumber2">
<option value="5">5 Years</option>
<option value="10">10 Years</option>
<option value="15">15 Years</option>
<option value="20">20 Years</option>
<option value="25">25 Years</option>
<option value="30">30 Years</option>
<option value="35">35 Years</option>
<option value="40">40 Years</option>
</select>
</p>
<P align="left">
<input type = Button name = b12 value = "Add Numbers" onClick = calculate()>
<P align="left">
<input type = Text name = txtThirdNumber2 size = 25 value = "">
</FORM>
</div></td>
<td> </td>
</tr>
</table>
<P>
<input type="button" value="Add Numbers" name="AddButton" onClick="CalculateSum(this.form.input_A.value, this.form.input_B.value, this.form.COL.value, this.form.input_A4.value, this.form.txtThirdNumber2.value,)">
<input type="button" value="Clear Fields" name="ClearButton" onClick="ClearForm(this.form)">
</P>
<P>F.O.C.U.S Total Life Insurance Needed=
<INPUT TYPE=TEXT NAME="Answer2" SIZE=12>
</P>
<FORM NAME="Calculator" METHOD="post">
<P> </P>
<P> </P>
<P> </P>
<P>Answer = <INPUT TYPE=TEXT NAME="Answer" SIZE=12></P>
</FORM>
</BODY>
</HTML>
Hello –
>> Ok, I am such a nOOb at Java,
Well, I know you meant javascript, but people will jump all over you if you confuse java and javascript because they are 2 completely different languages.
Just looking at the post – you’d want to not have it where you do:
</SCRIPT>
</HEAD><SCRIPT language = JavaScript>
You want to put it in your head section (btw, you might want to look at your markup – if you eventually want to go to xhtml, your tags would be all lower case). The closing head and script tags should not be there. You don’t need a language attribute but you do need a type attribute on your script tag. So it should be something like:
<!DOCTYPE whatever your doc-type is….
<head>
<script type="text/javascript">
function myCalculator1 () {
… }
function myCalculator2 () {
… }
…..
</script>
</head>
<body>…
<form>
<input …>
<input …>
<input type="button" onclick="javascript:myCalculate1(); return true;">
<input …>
<input …>
<input type="button" onclick="javascript:myCalculate2(); return true;">
</form>
</body>
</html>
I know you’re probably just testing, but you should clean up your markup. I’d get rid of the empty <p></p>, put all your attributes in quotes (i.e. <input type="text" name="answer" size="12"> …), get rid of your <font…> tags and use css, etc, but that’s not really your question.
I’m not looking at the javascript functionality itself – but you can put more than one function in a <script> </script>. You also shouldn’t have to use 3 separate forms to calculate your intermediate numbers – and all your input type tags should be contained in a form element.
You can attach a click event on the button so that you call the appropriate javascript function to calculate that portion of your calculation. And you cannot have the calculate function defined twice (even though your using different variables in the calculation). What you’d want to do is define different javascript functions and use the onclick event to associate a particular button with it’s associated function.
Hope this helps – I didn’t even look at the javascript itself… You need to fix up the basics so it’s easier for you to debug. If you haven’t already – use firefox and the javascript debugger firebug when you do get going – you’ll be able to see what’s going on and learn alot from that as well…
Jeez, The code was a total mess !!!
<html>
<SCRIPT language = "JavaScript">
function calculate1() {
A = document.frmOne.txtFirstNumber1.value;
B = document.frmOne.txtSecondNumber1.value;
C = (A * B);
document.frmOne.txtThirdNumber1.value = C;
}
function calculate2() {
A = document.frmTwo.txtFirstNumber2.value;
B = document.frmTwo.txtSecondNumber2.value;
C = (A * B);
document.frmTwo.txtThirdNumber2.value = C;
}
</SCRIPT>
<BODY>
<P><FONT SIZE="+2">F.O.C.U.S. Life Insurance Calculator</FONT></P>
<table width="750" border="2" cellpadding="2">
<tr>
<td width="169"><font size="+3">F</font> – Funeral Expenses:</td>
<td width="246"><input type=TEXT name="input_A" size=25></td>
<td width="305"><font size="2">Flowers, Burial Plots, Caskets, Professional and Transportation Services, Food, Airfare, and
Others. Typically, the average funeral in the US is between $8,000 – $10,000. </font></td>
</tr>
<tr>
<td><font size="+3">O </font>- Other Debts:</td>
<td><input type=TEXT name="input_B" size=25>
></td>
<td><font size="2">Other Debts: Mortgages, Vehicle Loans, Credit Cards and other fiduciary responsibilities.</font></td>
</tr>
<tr>
<td><font size="+3">C </font>- College </td>
<td><FORM NAME = frmOne>
<p>Number of Children
<select name="txtFirstNumber1" id="txtFirstNumber1">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</p>
<p>Type of College
<select name="txtSecondNumber1" id="txtSecondNumber1">
<option value="40000">Public/$10,000 per year</option>
<option value="100000">Private/$25,000 per year</option>
</select>
</p>
<P>
<input type = Button name = b1 value = "Add Numbers" onClick = "calculate1()">
<P>
<input type = Text name = txtThirdNumber1 size = 25 value = "">
</FORM></td>
<td><table cellspacing="0" cellpadding="0">
<td colspan="8" height="32" width="515"><font size="2">The average cost of a (4) year public school is $10,000 per year and
$25,000 per year for private universities. You will want to choose the number of children you have here, if "0" leave
blank.</font></td>
</table></td>
</tr>
<tr>
<td><font size="+3">U</font> – Unforeseen Expenses </td>
<td><input type=TEXT name="input_A4" size=25></td>
<td> </td>
</tr>
<tr>
<td><font size="+3">S</font> – Salary </td>
<td><div align="center">
<FORM NAME = frmTwo>
<p align="left">Salary Needed Per Year
<INPUT TYPE = Text NAME = "txtFirstNumber2" SIZE = 15 value ="">
</p>
<p align="left">Number of Years
<select name="txtSecondNumber2" id="txtsecondNumber2">
<option value="5">5 Years</option>
<option value="10">10 Years</option>
<option value="15">15 Years</option>
<option value="20">20 Years</option>
<option value="25">25 Years</option>
<option value="30">30 Years</option>
<option value="35">35 Years</option>
<option value="40">40 Years</option>
</select>
</p>
<P align="left">
<input type = Button name = b12 value = "Add Numbers" onClick = "calculate2()">
<P align="left">
<input type = Text name = txtThirdNumber2 size = 25 value = "">
</FORM>
</div></td>
<td> </td>
</tr>
</table>
<P>
<input type="button" value="Add Numbers" name="AddButton" onClick="CalculateSum(this.form.input_A….
this.form.input_B.value, this.form.COL.value, this.form.input_A4.value, this.form.txtThirdNumber2.value,)">
<input type="button" value="Clear Fields" name="ClearButton" onClick="ClearForm(this.form)">
</P>
<P>F.O.C.U.S Total Life Insurance Needed=
<INPUT TYPE=TEXT NAME="Answer2" SIZE=12>
</P>
<FORM NAME="Calculator" METHOD="post">
<P> </P>
<P> </P>
<P> </P>
<P>Answer = <INPUT TYPE=TEXT NAME="Answer" SIZE=12></P>
</FORM>
</BODY>
</HTML>
This is as far as I could go. Code seems to work now.
Mistakes :-
1) Calculate function was defines twice with similar case.
2) Semi colon missing at the end of some statements.
3) frmOne/frmTwo was not refered properly in calculate function.
Missing Information :
CalculateSum() function was missing so I couldn’t finish the program..
mail me at jeremiah.4u@gmail.com for any further help as I’m not that often with yahoo answer.
1. first of all u have 2 functions with the same name calculate()
so change those 2 to have 2 different names. because the Browser wouldn’t know which one you are referring to when u call Calculate.
I’m guessing the second calculate function is for the second part
so:
function calculate2() {
A = document.frmTwo.txtFirstNumber2.value;
B = document.frmTwo.txtSecondNumber2.options[ document.frmTwo.txtSecondNumber2. selectedIndex].value
C = (A * B)
document.frmTwo.txtThirdNumber2.value = C
}
notice the change:
from frmOne to frmTwo
from txtFirstNumber2.value to txtFirstNumber2.options[ txtFirstNumber2.selectedIndex ]
2. where is the function "CalculateSum"?
3. when accessing a select tag(the combo box) do this:
document.frmOne.txtFirstNumber1.options[ document.frmOne.txtFirstNumber1.selectedIndex ]
instead of document.frmOne.txtFirstNumber1.value;
4. you don’t really need 2 forms. just have 1 form.
5. accessing objects the way u do works fine. but i prefer:
document.getElementById(‘txtFirstNumber’) etc…
instead of document.frmOne.txtFirstNumber1. when u use getElementById there are 2 benefits 1st u don’t have to know the form the input belongs to as a matter of fact u don’t need to have the form. 2nd ly you can pass any value into the getElementById() function meaning programmatically you can access any element. 1 catch though, you must specify the id=” attribute of the tag you’re trying to access.
6. last but not least always put ; after each statement. though not necessary it’s just bad
7. use mozilla firefox with the addon FireBug.. when mozilla is working fine check on IE. enable debug on IE:
Tools> Internet Options>Advanced> uncheck Disable Script Debugging (both Internet Explorer and Other)
as for the last part.. fix your errors first. then try the last part yourself see what you come up with if you can’t handle it come back
Good Luck