Form with some calculation but input fields are resulting to NaN.

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Phoumano Somvie
    New Member
    • Apr 2011
    • 1

    #1

    Form with some calculation but input fields are resulting to NaN.

    I am trying to do some calculation with this form but some input fields are resulting NaN. Can anyone explain the error and a fix? Thanks


    Code:
    <!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() 
    {	
    	
    majorOD = Number(document.catalog_form.majorOD.value);
    BodyLength = Number(document.catalog_form.BodyLength.value);
    CoilsNCord = Number(BodyLength/majorOD);
    document.catalog_form.CoilsNCord.value = CoilsNCord;
    
    mandrelSize = Number(document.catalog_form.mandrelSize.value);                     
    CCD = Number((1.2*mandrelSize)+(2*majorOD));
    document.catalog_form.CCD.value = CCD;
    
    FCCB = Number((3.14159*BodyLength)*(CCD-majorOD)/majorOD)/12;
    document.catalog_form.FCCB.value = FCCB;
    
    TanA = Number(document.catalog_form.TanA.value);
    TanB = Number(document.catalog_form.TanB.value);
    FCCC = Number(FCCB+((TanA+TanB)/12));
    document.catalog_form.FCCC.value = FCCC;
    
    jacket = Number(document.catalog_form.jacket_2.value);
    ExtNoTan = Number(jacket*FCCB); 
    document.catalog_form.ExtNoTan_2.value = ExtNoTan;
    MinEx = Number(ExtNoTan+(0.12*ExtNoTan));   
    document.catalog_form.MinEx_2.value = MinEx;  
    MaxEx = Number(MinEx+(0.24*MinEx)); 
    document.catalog_form.MaxEx_2.value = 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="270">&nbsp;</td>
        <td width="319">&nbsp;</td>
        <td colspan="2">Mandrel Sizes Available:</td>
        <td width="145"></td>
      </tr>
      <tr>
        <td width="270">Cable Major OD: <input type="text" name="majorOD" size="10"></td>
        <td width="319"># Coils in Cord: 
          <input type="text" name="CoilsNCord" size="10" disabled="disabled"/></td>
        <td width="70" rowspan="10" align="center" valign="top">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;</td>
        <td width="70" rowspan="10" align="center" valign="top">.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;</td>
        <td width="145">&nbsp;</td>
      </tr>
      <tr>
        <td>Cable Minor OD: <input type="text" name="MinorOD" size="10" onChange=calculate();></td>
        <td>Coil Diameter:      
          <input type="text" name="CCD" size="10" disabled="disabled"/></td>
        <td>&nbsp;</td>
      </tr>
       <tr>
        <td>Mandrel Size: <input type="text" name="mandrelSize" size="10" onChange=calculate();></td>
        <td>Ft. of Cable in Coil Body: 
          <input type="text" name="FCCB" size="10" disabled="disabled"/></td>
        <td>&nbsp;</td>
      </tr>
       <tr>
        <td>Body Length: <input type="text" name="BodyLength" size="10" onChange=calculate();></td>
        <td>Ft. of Cable in Coil Cord:      
          <input type="text" name="FCCC" size="10" disabled="disabled"/></td>
        <td>&nbsp;</td>
      </tr>
       <tr>
        <td>Tangent A: <input type="text" name="TanA" size="10" onChange=calculate();></td>
        <td></td>
        <td>&nbsp;</td>
      </tr>
       <tr>
        <td>Tangent B: <input type="text" name="TanB" size="10" onChange=calculate();></td>
        <td></td>
        <td>&nbsp;</td>
      </tr>
       <tr>
        <td></td>
        <td>Minimum Extended:      
          <input type="text" name="MinEx_2"  style="background-color:yellow" size="10" disabled="disabled"/></td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>Extension Percent: <input type="text" name="ExtPer" value=".70" id="ExtPer" size="10" disabled="disabled" onChange=calculate();/>
    </td>
        <td>Extension Without Tangent:      
          <input type="text" name="ExtNoTan_2" style="background-color:yellow" size="10" disabled="disabled"/></td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td></td>
        <td>Maximum Extended:      
          <input type="text" name="MaxEx_2" style="background-color:yellow" size="10" disabled="disabled"/></td>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td></td>
        <td></td>
        <td>&nbsp;</td>
      </tr>
       <tr>
        <td colspan="2" align="center">Cable Construction</td>
        <td colspan="2" align="center">&nbsp;</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 colspan="2" align="center"><p>&nbsp;</p>      <p>&nbsp;</p></td>
       <td>&nbsp;</td>
      </tr>
    
    </table>
    
    </form>  
    </body>
    </html>
    Last edited by Dormilich; Apr 27 '11, 07:55 AM. Reason: please use [CODE] [/CODE] tags when posting code
  • Dormilich
    Recognized Expert Expert
    • Aug 2008
    • 8694

    #2
    I only can explain why. you get NaN when the input can’t be converted to a number (hence NaN – Not a Number).

    Comment

    Working...