/    Sign up×
Community /Pin to ProfileBookmark

Complete Newbie, can someone please help get this to work.

Copy linkTweet thisAlerts:
Apr 08.2011

My first attempt at javascript. I’m trying to build this calculator but can’t seem to get part of the script (in red) to work. Can someone explain what I’ve done wrong.

Thanks

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml“>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Coil Cord Calculator</title>
</head>

<body>

<script language=”JavaScript”>

function calculate()
{
A1 = document.catalog_form.a1.value
B1 = document.catalog_form.b1.value
C1 = (B1/A1)
document.catalog_form.c1.value = C1

MS = document.catalog_form.maSize.value

CCD = ((1.2*MS)+(2*A1))
document.catalog_form.CCD.value = CCD

FCCB =((3.14159*B1)*(CCD-A1)/A1)/12
document.catalog_form.FCCB.value = FCCB

TanA = document.catalog_form.TanA.value
TanB = document.catalog_form.TanB.value
FCCC = FCCB+((TanA+Tan?/12)
document.catalog_form.FCCC.value = FCCC

[COLOR=”Red”]jacket = document.catalog_form.jacket.value
ExtNoTan = jacket*FCCB
MinEx =ExtNoTan+(0.12*ExtNoTan)
document.catalog_form.MinEx.value = MinEx
MaxEx =MinEx+(0.24*MinEx)
document.catalog_form.MaxEx.value = MaxEx[/COLOR]
}

function displayPercent(jacket)
{
document.getElementById(“ExtPer”).value=jacket
}

</script>

<form name=”catalog_form”>
<table width=”946″ border=”1″ cellpadding=”3″ cellspacing=”5″>
<tr>
<td colspan=”5″ align=”center”><h1>Coil Cord Calculator</h1> </td>
</tr>
<tr>
<td width=”268″>&nbsp;</td>
<td width=”315″>&nbsp;</td>
<td width=”93″>Round</td>
<td width=”89″>Flat</td>
<td width=”139″></td>
</tr>
<tr>
<td width=”268″>Cable Major OD: <input type=”text” name=”a1″></td>
<td width=”315″># Coils in Cord:
<input type=”text” name=”c1″ >
</td>
<td width=”93″>&nbsp;</td>
<td width=”89″>&nbsp;</td>
<td width=”139″>&nbsp;</td>
</tr>
<tr>
<td>Cable Minor OD: <input type=”text” name=”MinorOD” onChange=calculate();></td>
<td>Coil Diameter:
<input type=”text” name=”CCD” ></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Mandrel Size: <input type=”text” name=”maSize” onChange=calculate();></td>
<td>Ft. of Cable in Coil Body::
<input type=”text” name=”FCCB” ></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Body Length: <input type=”text” name=”b1″ onChange=calculate();></td>
<td>Ft. of Cable in Coil Cord:
<input type=”text” name=”FCCC” ></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Tangent A: <input type=”text” name=”TanA” onChange=calculate();></td>
<td></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Tangent B: <input type=”text” name=”TanB” onChange=calculate();></td>
<td></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td></td>
<td>Minimum Extended:
<input type=”text” name=”MinEx” ></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>Extension Percent: <input type=”text” value=”.70″ id=”ExtPer” />
</td>
<td>Extension Without Tangent:
<input type=”text” name=”ExWTan” ></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td></td>
<td>Maximum Extended:
<input type=”text” name=”” ></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td></td>
<td></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan=”2″ align=”center”>Cable Construction</td>
<td colspan=”2″ align=”center”>Mandrel Sizes Available:</td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan=”2″ valign=”top”><p>
<input type=”radio” name=”jacket” onClick=”displayPercent(this.value)” value=”.70″ checked=”checked”>Polyurethane Jacket<br />
<input type=”radio” name=”jacket” onClick=”displayPercent(this.value)” value=”.65″>TPE Jacket<br />
<input type=”radio” name=”jacket” onClick=”displayPercent(this.value)” value=”.60″>Polypropylene or Hytrel primaries with PVC Jacket
<br />
<input type=”radio” name=”jacket” onClick=”displayPercent(this.value)” value=”.55″>PVC primaries with PVC jacket
<br />
<input type=”radio” name=”jacket” onClick=”displayPercent(this.value)” value=”.50″>Other<br /> </p></td>
<td align=”center”><p>1/8&quot;<br />
3/16&quot;<br />
5/16&quot;<br />
.355&quot;<br />
3/8&quot;<br />
7/16&quot;<br />
1/2&quot;<br />
.720&quot;<br />
1&quot;<br />
3&quot;</p></td>
<td align=”center”><p>.125&quot;<br />
.1875&quot;<br />
.25&quot;<br />
.355&quot;<br />
.375&quot;<br />
.4375&quot;<br />
.500&quot;<br />
.720&quot;<br />
1&quot;<br />
3&quot;</p></td>
<td>&nbsp;</td>
</tr>

</table>

</form>

</body>
</html>

to post a comment
JavaScript

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@WolfShadeApr 08.2011 — A) You should put [color=red];[/color] at the end of each command.

? You have an input with no name, that I am assuming should be MaxEx.
Copy linkTweet thisAlerts:
@PhoumanoauthorApr 08.2011 — WolfShade...Thanks for the reply. I appreciate you helping out and have applied your suggestions, unfortunately I am still encounter some error. Would you be able explain the areas in red. Thanks

jacket = document.catalog_form.jacket.value;

ExtNoTan = jacket*FCCB; [COLOR="Red"]//This part doesn't doesn't execute[/COLOR]

MinEx =ExtNoTan+(0.12*ExtNoTan);[COLOR="Red"] //Getting NaN in this field[/COLOR]

document.catalog_form.MinEx.value = MinEx;

MaxEx =MinEx+(0.24*MinEx);[COLOR="red"]//Getting NaN in this field[/COLOR]

document.catalog_form.MaxEx.value = MaxEx;
Copy linkTweet thisAlerts:
@WolfShadeApr 08.2011 — What is the error message?

Try putting the formulas inside a parseFloat():
<i>
</i>jacket = parseFloat(document.catalog_form.jacket.value);
ExtNoTan = parseFloat(jacket*FCCB); //This part doesn't doesn't execute
MinEx = parseFloat(ExtNoTan+(0.12*ExtNoTan)); //Getting NaN in this field
document.catalog_form.MinEx.value = parseFloat(MinEx);
MaxEx = parseFloat(MinEx+(0.24*MinEx));//Getting NaN in this field
document.catalog_form.MaxEx.value = parseFloat(MaxEx);
Copy linkTweet thisAlerts:
@PhoumanoauthorApr 08.2011 — I'm getting the same result. If you can view the page and and plug in some numbers in the first column it will execute code and populate other part of the form. The second column fields with red background indicate the problem areas. Thank you for help.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Coil Cord Calculator</title>

<script language="JavaScript">

function calculate()

{

A1 = document.catalog_form.a1.value;

B1 = document.catalog_form.b1.value;

C1 = (B1/A1);

document.catalog_form.c1.value = C1;

MS = document.catalog_form.maSize.value ;


CCD = ((1.2*MS)+(2*A1));

document.catalog_form.CCD.value = CCD;

FCCB =((3.14159*B1)*(CCD-A1)/A1)/12;

document.catalog_form.FCCB.value = FCCB;

TanA = document.catalog_form.TanA.value;

TanB = document.catalog_form.TanB.value;

FCCC = FCCB+((TanA+Tan?/12);

document.catalog_form.FCCC.value = FCCC;

jacket = parseFloat(document.catalog_form.jacket.value);

ExtNoTan = parseFloat(jacket*FCC?;

MinEx = parseFloat(ExtNoTan+(0.12*ExtNoTan));


document.catalog_form.MinEx.value = parseFloat(MinEx);


MaxEx = parseFloat(MinEx+(0.24*MinEx));

document.catalog_form.MaxEx.value = parseFloat(MaxEx);

}

function displayPercent(jacket)

{

document.getElementById("ExtPer").value=jacket

}

</script>


</head>

<body>


<form name="catalog_form">

<table width="946" border="1" cellpadding="3" cellspacing="5">

<tr>

<td colspan="5" align="center"><h1>Coil Cord Calculator</h1> </td>

</tr>

<tr>

<td width="268">&nbsp;</td>

<td width="315">&nbsp;</td>

<td width="93">Round</td>

<td width="89">Flat</td>

<td width="139"></td>

</tr>

<tr>

<td width="268">Cable Major OD: <input type="text" name="a1" ></td>

<td width="315"># Coils in Cord:

<input type="text" name="c1" >

</td>

<td width="93">&nbsp;</td>

<td width="89">&nbsp;</td>

<td width="139">&nbsp;</td>

</tr>

<tr>

<td>Cable Minor OD: <input type="text" name="MinorOD" onChange=calculate();></td>

<td>Coil Diameter:

<input type="text" name="CCD" ></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td>Mandrel Size: <input type="text" name="maSize" onChange=calculate();></td>

<td>Ft. of Cable in Coil Body::

<input type="text" name="FCCB" ></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td>Body Length: <input type="text" name="b1" onChange=calculate();></td>

<td>Ft. of Cable in Coil Cord:

<input type="text" name="FCCC" ></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td>Tangent A: <input type="text" name="TanA" onChange=calculate();></td>

<td></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td>Tangent B: <input type="text" name="TanB" onChange=calculate();></td>

<td></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td></td>

<td>Minimum Extended:

<input type="text" name="MinEx" style="background-color:red"></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td>Extension Percent: <input type="text" value=".70" id="ExtPer" />

</td>

<td>Extension Without Tangent:

<input type="text" name="ExWTan" style="background-color:red"></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td></td>

<td>Maximum Extended:

<input type="text" name="MaxEx" style="background-color:red"></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td></td>

<td></td>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td colspan="2" align="center">Cable Construction</td>

<td colspan="2" align="center">Mandrel Sizes Available:</td>

<td>&nbsp;</td>

</tr>

<tr>

<td colspan="2" valign="top"><p>

<input type="radio" name="jacket" onClick="displayPercent(this.value)" value=".70" checked="checked">Polyurethane Jacket<br />

<input type="radio" name="jacket" onClick="displayPercent(this.value)" value=".65">TPE Jacket<br />

<input type="radio" name="jacket" onClick="displayPercent(this.value)" value=".60">Polypropylene or Hytrel primaries with PVC Jacket

<br />

<input type="radio" name="jacket" onClick="displayPercent(this.value)" value=".55">PVC primaries with PVC jacket

<br />

<input type="radio" name="jacket" onClick="displayPercent(this.value)" value=".50">Other<br /> </p></td>

<td align="center"><p>1/8&quot;<br />

3/16&quot;<br />

5/16&quot;<br />

.355&quot;<br />

3/8&quot;<br />

7/16&quot;<br />

1/2&quot;<br />

.720&quot;<br />

1&quot;<br />

3&quot;</p></td>

<td align="center"><p>.125&quot;<br />

.1875&quot;<br />

.25&quot;<br />

.355&quot;<br />

.375&quot;<br />

.4375&quot;<br />

.500&quot;<br />

.720&quot;<br />

1&quot;<br />

3&quot;</p></td>

<td>&nbsp;</td>

</tr>

</table>

</form>


</body>

</html>
×

Success!

Help @Phoumano spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...