/    Sign up×
Community /Pin to ProfileBookmark

Help with Jave Script Please

Copy linkTweet thisAlerts:
Jan 28.2008

Please help me out here. I can’t figure out for the life of me why this BMI calculator works on one page, but not the other. Please excuse the way the pages look I didn’t upload all the files.

This one works:
[URL=”http://www.4yourbody.info/test/1″]http://www.4yourbody.info/test/1[/URL]

This one doesn’t:
[URL=”http://www.4yourbody.info/test/2″]http://www.4yourbody.info/test/2[/URL]

I received this reply to an earlier post:
f.wt has no properties
compute() (line 25)
onclick(click clientX=0, clientY=0)2 (line 1)
[Break on this error] w = f.wt.value;

I have no idea what that means. I don’t know anything when it comes to Java. The Java Script that controls the calculator is in the head tag. Can you tell me how to fix this problem? What line number the error is on? What the value should be? I got permission from the National Institute of Health to use this calculator and can’t get it to work when I put it in my page. Thought it would be easy – fooled me.

to post a comment
JavaScript

12 Comments(s) ↴

Copy linkTweet thisAlerts:
@toicontienJan 28.2008 — The variable "f" appears to reference a FORM tag. The ".wt" part should reference a form field whose name is "wt" inside the FORM tag. If you do not have any form fields named "wt" inside the FORM, that's where your error is coming from.
Copy linkTweet thisAlerts:
@4yourbody_infoauthorJan 28.2008 — Can you give me a more specific answer with this information.

The variable "f" appears to reference a FORM tag. The ".wt" part should reference a form field whose name is "wt" inside the FORM tag. If you do not have any form fields named "wt" inside the FORM, that's where your error is coming from.[/QUOTE]

This is the layout and form code:

<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="200"
SUMMARY="This table is used for layout purposes only." id="table92">
<TR>
<TD BGCOLOR="#6F48B3" WIDTH="200" COLSPAN="3">
<TABLE WIDTH="209" BORDER="0" CELLPADDING="0"
CELLSPACING="0" SUMMARY="This table is used for layout purposes only." id="table93">
<TR>
<TD BGCOLOR="#FFFFFF">
<IMG SRC="../../images/body_mass_index_calculator/bmi-e_01.gif" BORDER="0" ALT="Standard Measurements"
WIDTH="105" HEIGHT="28"></TD>
<TD BGCOLOR="#FFFFFF"><A HREF="../general_health/bmi-m.htm">
<IMG SRC="../../images/body_mass_index_calculator/bmi-e_02.gif" BORDER="0" ALT="View Metric Measurements"
WIDTH="104" HEIGHT="28"></A></TD>
</TR>
</TABLE></TD>
</TR>
<TR>
<TD BGCOLOR="#6F48B3" WIDTH="13">
<IMG BORDER="0" SRC="../../images/spacer.gif" WIDTH="12" HEIGHT="1" ALT=" "></TD>
<TD BGCOLOR="#6F48B3" WIDTH="184">
<TABLE BORDER="0" CELLSPACING="0" WIDTH="185"
BGCOLOR="#FFFFFF" CELLPADDING="2"
SUMMARY="This table is used for layout purposes only." id="table94">
<TR>
<TD WIDTH="199" COLSPAN="3" ALIGN="center">
<TABLE CELLSPACING="0" CELLPADDING="0" BORDER="0"
WIDTH="150" SUMMARY="This table is used for layout purposes only." id="table95">
<TR>
<TD ROWSPAN="3" ALIGN="right" WIDTH="50">
<IMG SRC="../../images/body_mass_index_calculator/bmi_1-4.gif" ALT=" " WIDTH="36" HEIGHT="201"></TD>
<TD VALIGN="top" WIDTH="50">
<IMG SRC="../../images/body_mass_index_calculator/bmi_2-4.gif" ALT=" " WIDTH="50" HEIGHT="76"></TD>
<TD ROWSPAN="3" ALIGN="left" WIDTH="92">
<IMG SRC="../../images/body_mass_index_calculator/bmi_4-4.gif" ALT=" " WIDTH="57" HEIGHT="201"></TD>
</TR>
<TR>
<TD ALIGN="center" WIDTH="50">
<INPUT NAME="bmi" TYPE="text" SIZE="4" STYLE="text-align: center"></TD>
</TR>
<TR>
<TD VALIGN="bottom" WIDTH="50">
<IMG SRC="../../images/body_mass_index_calculator/bmi_3-4.gif" ALT=" " WIDTH="50" HEIGHT="96"></TD>
</TR>
</TABLE> </TD>
</TR>
<TR>
<TD WIDTH="95"><SPAN
STYLE="font-size: 10pt;"><LABEL FOR="htf"><B>Your
Height:</B></LABEL></SPAN></TD>
<TD WIDTH="45" ALIGN="left"><INPUT
TYPE="text" NAME="htf" SIZE="3" ID="htf"></TD>
<TD WIDTH="50" ALIGN="left"><INPUT
TYPE="text" NAME="hti" SIZE="3" ID="hti"></TD>
</TR>
<TR>
<TD WIDTH="95"><SPAN
STYLE="font-size: 10pt;">&nbsp;</SPAN></TD>
<TD WIDTH="45" ALIGN="left"><B><SPAN
STYLE="font-size: 10pt;">(feet)</SPAN></B></TD>
<TD WIDTH="53" ALIGN="left"><B><SPAN
STYLE="font-size: 10pt;">(inches)</SPAN></B></TD>
</TR>
<TR>
<TD WIDTH="95"><SPAN
STYLE="font-size: 10pt;"><B><LABEL FOR="wt">Your
Weight:</LABEL></B></SPAN></TD>
<TD WIDTH="45" ALIGN="left">
<INPUT TYPE="text" NAME="wt" SIZE="3"
ID="wt"></TD>
<TD WIDTH="53" ALIGN="left">&nbsp;</TD>
</TR>
<TR>
<TD WIDTH="95"><SPAN
STYLE="font-size: 10pt;">&nbsp;</SPAN></TD>
<TD ALIGN="left" COLSPAN="2"> <B><SPAN
STYLE="font-size: 10pt;">(pounds)</SPAN></B></TD>
</TR>
<TR>
<TD COLSPAN="3" ALIGN="center"><INPUT TYPE="button"
VALUE="Give Me My BMI" ONCLICK="self.compute();"></TD>
</TR>
</TABLE></TD>
<TD BGCOLOR="#6F48B3" WIDTH="13">
<IMG BORDER="0" SRC="../../images/spacer.gif" WIDTH="12" HEIGHT="1" ALT=" "></TD>
</TR>
<TR>
<TD BGCOLOR="#6F48B3" COLSPAN="3" WIDTH="100%"
ALIGN="CENTER">&nbsp;</TD>
</TR>
</TABLE> </TD>
</TR>
</TABLE>


This is the script:

<SCRIPT LANGUAGE="Javascript" TYPE="text/javascript">

<!--

function cal_bmi(lbs, ins)

{

h2 = ins * ins;

bmi = lbs/h2 * 703

f_bmi = Math.floor(bmi);

diff = bmi - f_bmi;

diff = diff * 10;

diff = Math.round(diff);



if (diff == 10) // Need to bump up the whole thing instead

{

f_bmi += 1;

diff = 0;

}

bmi = f_bmi + "." + diff;

return bmi;

}

function compute(){

var f = self.document.forms[0];

w = f.wt.value;

v = f.htf.value;

u = f.hti.value;

// Format values for the BMI calculation

if (!chkw(u))

{

var ii = 0;

f.hti.value = 0;

} else

{

var it = f.hti.value*1;

var ii = parseInt(it);

}

var fi = parseInt(f.htf.value * 12);

var i = parseInt(f.htf.value * 12) + f.hti.value*1.0; // var i = fi + ii; [email][email protected][/email]: now the height in inches is correctly summed

// Do validation of remaining fields to check for existence of values

if (!chkw(v))

{

alert("Please enter a number for your height.");

f.htf.focus();

return;

}

if (!chkw(w))

{

alert("Please enter a number for your weight.");

f.wt.focus();

return;

}

// Perform the calculation

f.bmi.value = cal_bmi(w, i);

f.bmi.focus();

}

function chkw(w){

if (isNaN(parseInt(w))){

return false;

} else if (w < 0){

return false;

}

else{

return true;

}

}

// -->

</SCRIPT>
Copy linkTweet thisAlerts:
@toicontienJan 28.2008 — Be careful with how you get references to FORM tags:
var f = self.document.forms[0];

This method of getting a FORM tag reference is almost never a good idea if your code will go on other people's pages, and you have no control over the page markup. Add an Id attribute to your FORM tag, and make it id="frmBMICalc".

var f = document.getElementById("frmBMICalc");
Copy linkTweet thisAlerts:
@4yourbody_infoauthorJan 28.2008 — I changed the line in the Java Script that you referred to, but it still doesn't work. Like I said before, I'm a total nube when it comes to Java.
Copy linkTweet thisAlerts:
@cgishackJan 28.2008 — You code is looking for a <form>

it is undefined.

You need to have form[0] wrapped around your input boxes

All i could see in your code was forms for google ads.

Drew
Copy linkTweet thisAlerts:
@4yourbody_infoauthorJan 29.2008 — I found a difference in the code from the one that works and the one that doesn't. There were no <form> tags around the form. I fixed that, but it still doesn't work. What is meant by, "You need to have form[0] wrapped around your input boxes."? Would you give me an example please? The actual code for the calculator and Java Script are in this this post. But, now the code for the calculator has <FORM NAME="bmi_input"> before it and </FORM> after.
Copy linkTweet thisAlerts:
@cgishackJan 29.2008 — You can do what toicontien said.

Give the form an ID of '[B]frmBMICalc[/B]' and then replace the code like he showed.

document.form[[B]0[/B]] means: You can have MANY forms on 1 page and 0 indicates the first form on the page.

if your form was the 3rd form on the page it would be document.form[[B]2[/B]]

Drew
Copy linkTweet thisAlerts:
@4yourbody_infoauthorJan 29.2008 — I have no idea what you mean; I'm so lost it isn't funny. I've been working on this one problem for about a week straight now and just can't get it figured out. I removed the other forms from the page to see if that would work - nope. i found the missing <form> tags and put them in - nope. I don't know what to do.

And, as for what toicontien said, does the '[B]frmBMICalc[/B]' go in the actual script and then I change the <FORM NAME="bmi_input"> to <FORM NAME="frmBMICalc">?

Also, I can't even pretend to know what any of this means: document.form[0] means: You can have MANY forms on 1 page and 0 indicates the first form on the page.

if your form was the 3rd form on the page it would be document.form[2]

Please be patient I'm really trying.

I'm doing all of this in FrontPage if that means anything to you.
Copy linkTweet thisAlerts:
@cgishackJan 29.2008 — <FORM [B][COLOR="Red"]id[/COLOR][/B]="[B]bmi_input[/B]">

.. JS

var f = document.[COLOR="Red"]get[/COLOR][COLOR="Blue"]Element[/COLOR][COLOR="Orange"]By[/COLOR][COLOR="Magenta"]Id[/COLOR]("[B]bmi_input[/B]");
Copy linkTweet thisAlerts:
@4yourbody_infoauthorJan 29.2008 — [B]It's still not working!!![/B]

This is the Script changed to what you said:

<SCRIPT LANGUAGE="Javascript" TYPE="text/javascript">

<!--

function cal_bmi(lbs, ins)

{

h2 = ins * ins;

bmi = lbs/h2 * 703

f_bmi = Math.floor(bmi);

diff = bmi - f_bmi;

diff = diff * 10;

diff = Math.round(diff);



if (diff == 10) // Need to bump up the whole thing instead

{

f_bmi += 1;

diff = 0;

}

bmi = f_bmi + "." + diff;

return bmi;

}

function compute(){

var f = document.getElementById("bmi_input");


w = f.wt.value;

v = f.htf.value;

u = f.hti.value;

// Format values for the BMI calculation

if (!chkw(u))

{

var ii = 0;

f.hti.value = 0;

} else

{

var it = f.hti.value*1;

var ii = parseInt(it);

}

var fi = parseInt(f.htf.value * 12);

var i = parseInt(f.htf.value * 12) + f.hti.value*1.0; // var i = fi + ii; [email][email protected][/email]: now the height in inches is correctly summed

// Do validation of remaining fields to check for existence of values

if (!chkw(v))

{

alert("Please enter a number for your height.");

f.htf.focus();

return;

}

if (!chkw(w))

{

alert("Please enter a number for your weight.");

f.wt.focus();

return;

}

// Perform the calculation

f.bmi.value = cal_bmi(w, i);

f.bmi.focus();

}

function chkw(w){

if (isNaN(parseInt(w))){

return false;

} else if (w < 0){

return false;

}

else{

return true;

}

}

// -->

</SCRIPT>



This is the form data:

<FORM NAME="bmi_input">

<TABLE BORDER="0" CELLPADDING="4" CELLSPACING="0" WIDTH="600"

SUMMARY="This table is used for layout purposes only.">

<TR>

<TD VALIGN="TOP">

<P><A NAME="content"></A> Body mass index (BMI) is a

measure of body fat based on height and weight that

applies to both <B>adult</B> men and women. </P>

<UL>

<LI>Enter your weight and height.</LI>

<LI>Click on &quot;Compute BMI&quot; and your BMI will appear in

the heart of the figure. </LI>

</UL>

<P><B>BMI Categories: </B></P>

<UL>

<LI>Underweight = &lt;18.5</LI>

<LI>Normal weight = 18.5-24.9 </LI>

<LI>Overweight = 25-29.9 </LI>

<LI>Obesity = BMI of 30 or greater </LI>

</UL>

</TD>

<TD WIDTH="215" VALIGN="top" ALIGN="right">

<P ALIGN="CENTER"></P>

<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="200"

SUMMARY="This table is used for layout purposes only.">

<TR>

<TD BGCOLOR="#6F48B3" WIDTH="200" COLSPAN="3">

<TABLE WIDTH="209" BORDER="0" CELLPADDING="0"

CELLSPACING="0" SUMMARY="This table is used for layout purposes only.">

<TR>

<TD BGCOLOR="#FFFFFF">

<IMG SRC="images/bmi-e_01.gif" BORDER="0" ALT="Standard Measurements"

WIDTH="105" HEIGHT="28"></TD>

<TD BGCOLOR="#FFFFFF">&nbsp;</TD>

</TR>

</TABLE></TD>

</TR>

<TR>

<TD BGCOLOR="#6F48B3" WIDTH="13">

<IMG BORDER="0" SRC="images/spacer.gif" WIDTH="12" HEIGHT="1" ALT=" "></TD>

<TD BGCOLOR="#6F48B3" WIDTH="184">

<TABLE BORDER="0" CELLSPACING="0" WIDTH="185"

BGCOLOR="#FFFFFF" CELLPADDING="2"

SUMMARY="This table is used for layout purposes only.">

<TR>

<TD WIDTH="199" COLSPAN="3" ALIGN="center">

<TABLE CELLSPACING="0" CELLPADDING="0" BORDER="0"

WIDTH="150" SUMMARY="This table is used for layout purposes only.">

<TR>

<TD ROWSPAN="3" ALIGN="right" WIDTH="50">

<IMG SRC="images/bmi_1-4.gif" ALT=" " WIDTH="36" HEIGHT="201"></TD>

<TD VALIGN="top" WIDTH="50">

<IMG SRC="images/bmi_2-4.gif" ALT=" " WIDTH="50" HEIGHT="76"></TD>
<TD ROWSPAN="3" ALIGN="left" WIDTH="92">
<IMG SRC="images/bmi_4-4.gif" ALT=" " WIDTH="57" HEIGHT="201"></TD>
</TR>
<TR>
<TD ALIGN="center" WIDTH="50">
<INPUT NAME="bmi" TYPE="text" SIZE="4" STYLE="text-align: center"></TD>
</TR>
<TR>
<TD VALIGN="bottom" WIDTH="50">
<IMG SRC="images/bmi_3-4.gif" ALT=" " WIDTH="50" HEIGHT="96"></TD>
</TR>
</TABLE> </TD>
</TR>
<TR>
<TD WIDTH="95"><SPAN
STYLE="font-size: 10pt;"><LABEL FOR="htf"><B>
Your Height:</B></LABEL></SPAN></TD>
<TD WIDTH="45" ALIGN="left"><INPUT
TYPE="text" NAME="htf" SIZE="3" ID="htf"></TD>
<TD WIDTH="50" ALIGN="left"><INPUT
TYPE="text" NAME="hti" SIZE="3" ID="hti"></TD>
</TR>
<TR>
<TD WIDTH="95"><SPAN
STYLE="font-size: 10pt;">&nbsp;</SPAN></TD>
<TD WIDTH="45" ALIGN="left"><B><SPAN
STYLE="font-size: 10pt;">(feet)</SPAN></B></TD>
<TD WIDTH="53" ALIGN="left"><B><SPAN
STYLE="font-size: 10pt;">(inches)</SPAN></B></TD>
</TR>
<TR>
<TD WIDTH="95"><SPAN
STYLE="font-size: 10pt;"><B><LABEL FOR="wt">
Your Weight:</LABEL></B></SPAN></TD>
<TD WIDTH="45" ALIGN="left">
<P> <INPUT TYPE="text" NAME="wt" SIZE="3"
ID="wt"></P></TD>
<TD WIDTH="53" ALIGN="left">&nbsp;</TD>
</TR>
<TR>
<TD WIDTH="95"><SPAN
STYLE="font-size: 10pt;">&nbsp;</SPAN></TD>
<TD ALIGN="left" COLSPAN="2"> <B><SPAN
STYLE="font-size: 10pt;">(pounds)</SPAN></B></TD>
</TR>
<TR>
<TD COLSPAN="3" ALIGN="center"><INPUT TYPE="button"
VALUE="Compute BMI" ONCLICK="self.compute();"></TD>
</TR>
</TABLE></TD>
<TD BGCOLOR="#6F48B3" WIDTH="13">

<IMG BORDER="0" SRC="images/spacer.gif" WIDTH="12" HEIGHT="1" ALT=" "></TD>
</TR>
<TR>
<TD BGCOLOR="#6F48B3" COLSPAN="3" WIDTH="100%"
ALIGN="CENTER">&nbsp;</TD>
</TR>
</TABLE> </TD>
</TR>
</TABLE> </FORM>
Copy linkTweet thisAlerts:
@cgishackJan 29.2008 — change.,..<FORM NAME="bmi_input">

to

<FORM [B][COLOR="Red"]id[/COLOR][/B]="bmi_input">
Copy linkTweet thisAlerts:
@4yourbody_infoauthorJan 29.2008 — [B]Thank You, Thank You, THANK YOU!!![/B]

It works perfectly now.

What you did may have been simple for you, but to me it was all gobbledegook.

As far as I'm concerned you are no longer cgishack - I christen you JavaGod.
×

Success!

Help @4yourbody_info 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.25,
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: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

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