By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
460,036 Members | 1,142 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 460,036 IT Pros & Developers. It's quick & easy.

Problem - part 2

P: n/a
Can someone tell me why this script will only work on a Mac with Internet
Explorer.

Thanks,
Ed

<html>
<head>
<script type="text/javascript">
//Square Root
function squareroot()
{
var x=document.forms('root')
var data=x.elements['num'].value;
var sqr=Math.sqrt(data)
frames['sqrt'].document.write(sqr)
}
//Squared of an item
function squared()
{
var x=document.forms('square')
var data=x.elements['num2'].value;
var sum=data*data
frames['squaredframe'].document.write(sum)
}
//Tanget
function tangent()
{
var x=document.forms('tangent')
var data=x.elements['num3'].value;
var tan=Math.tan(data)
frames['tangentframe'].document.write(tan)
}
//Refresh Values
function refresh()
{
location.reload(sqrt)
location.reload(squaredframe)
location.reload(tangentframe)
}
</script>
</head>

<body>
<table width="100%" border="1">
<tr>
<td width="73%" height="50">
<form name="root">
Type in a number to compute the square root of the value.
<input name="num" type="text" id="num" size="10" maxlength="10">
<input name="button" type="button" onClick="squareroot()"
value="Compute">
</form></td>
<td width="27%" height="50"><iframe name="sqrt" width="100%" height="50"
frameborder="0" scrolling="no"></iframe></td>
</tr>
<tr>
<td height="50">
<form name="square">
Type in a number to compute the square of the value.
<input name="num2" type="text" id="num2" size="10" maxlength="10">
<input name="button2" type="button" onClick="squared()"
value="Compute">
</form></td>
<td><iframe name="squaredframe" width="100%" height="50" frameborder="0"
scrolling="no"></iframe></td>
</tr>
<tr>
<td height="50">
<form name="tangent">
Type in a number to compute the tanget of the value.
<input name="num3" type="text" id="num3" size="10" maxlength="10">
<input name="button3" type="button" onClick="tangent()"
value="Compute">
</form></td>
<td><iframe name="tangentframe" width="100%" height="50" frameborder="0"
scrolling="no"></iframe></td>
</tr>
</table>
<div align="right">
<form name="refresh">
Hit refresh to compute new values.
<input type="button" onClick="refresh()" value="Refresh Values">
</form>
</div>
</body>
</html>

Jul 20 '05 #1
Share this Question
Share on Google+
1 Reply


P: n/a
DU
Ed Blinn wrote:
Can someone tell me why this script will only work on a Mac with Internet
Explorer.

Thanks,
Ed

<html>
No doctype declaration.
http://www.hut.fi/u/hsivonen/doctype.html
http://www.w3.org/QA/2002/04/valid-dtd-list.html
<head>
<script type="text/javascript">
//Square Root
function squareroot()
{
var x=document.forms('root')
1- When editing any kind of code in any language, try to use meaningful,
intuitive, significant identifier names for variables. This is a good
coding practice which saves time to others reviewing your code, help
debugging with debuggers, etc..
2- forms["root"] is correct. forms[0] is even better since it will work
flawlessly in HTML strict DTD and XHTML strict DTD. forms('root') won't
work.

Together:

var objForm = document.forms["root"];
var data=x.elements['num'].value;
W3C DOM methods prefer
elements.namedItem("num").value

http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-76728479
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-75708506
http://www.w3.org/TR/DOM-Level-2-HTM...tion-namedItem

var sqr=Math.sqrt(data)
If data is a string, then calling Math.sqrt will not work... and num is
type="text"
http://devedge.netscape.com/library/...h.html#1197825
frames['sqrt'].document.write(sqr)
You must first open the iframed document, then write sqr, then close the
iframed document.

So:

frames["sqrt"].document.open();
"open:
Open a document stream for writing. If a document exists in the
target, this method clears it."
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-72161170
frames["sqrt"].document.write(sqr);
frames["sqrt"].document.close();

"close:
Closes a document stream opened by open() and forces rendering."
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-98948567

IMO, there is nothing, absolutely nothing which justifies the use of
iframes for the apparent purposes of your code.
}
//Squared of an item
function squared()
{
var x=document.forms('square')
var objFormSquare = document.forms["square"];
var data=x.elements['num2'].value;
var data = parseFloat(objFormSquare.elements.namedItem("num2" ).value);
var sum=data*data
frames['squaredframe'].document.write(sum)
open and close here too.
}
//Tanget
function tangent()
{
var x=document.forms('tangent')
forms["FormName"] or forms[index]
var data=x.elements['num3'].value;
var tan=Math.tan(data)
Again here too: parseFloat before calculating the tan.
The parameter must be a number.
http://devedge.netscape.com/library/...h.html#1194346
frames['tangentframe'].document.write(tan)
}
//Refresh Values
function refresh()
{
location.reload(sqrt)
frames["sqrt"].location.reload(true);
would be the correct way to force a reload but since you would open()
and then close() the iframe, then reloading the iframed document is no
longer necessary.
location.reload(squaredframe)
location.reload(tangentframe)
}
</script>
</head>

<body>
<table width="100%" border="1">
table design: avoid this whenever you can. Tables should be used only
for tabular data.
<tr>
<td width="73%" height="50">
<form name="root">
A table can be inside a form; the opposite creates invalid documents.
Here, the action attribute is missing. A validator would have reported
this as an error.
Type in a number to compute the square root of the value.
<input name="num" type="text" id="num" size="10" maxlength="10">
For several reasons which I won,t explicit here, I recommend to always
give distinct identifier values to name attribute and id attribute. If
you don't need to declare an id attribute, then don't.
<input name="button" type="button" onClick="squareroot()"
value="Compute">
</form></td>
<td width="27%" height="50"><iframe name="sqrt" width="100%" height="50"
frameborder="0" scrolling="no"></iframe></td>
</tr>
<tr>
<td height="50">
<form name="square">
same thing here: you can not have a form inside a table. Action missing.
Type in a number to compute the square of the value.
<input name="num2" type="text" id="num2" size="10" maxlength="10">
<input name="button2" type="button" onClick="squared()"
value="Compute">
</form></td>
<td><iframe name="squaredframe" width="100%" height="50" frameborder="0"
scrolling="no"></iframe></td>
</tr>
<tr>
<td height="50">
<form name="tangent">
action missing; form can not be within a table.
Type in a number to compute the tanget of the value.
<input name="num3" type="text" id="num3" size="10" maxlength="10">
<input name="button3" type="button" onClick="tangent()"
value="Compute">
</form></td>
<td><iframe name="tangentframe" width="100%" height="50" frameborder="0"
scrolling="no"></iframe></td>
</tr>
</table>
<div align="right">
<form name="refresh">
Hit refresh to compute new values.
<input type="button" onClick="refresh()" value="Refresh Values">
</form>
</div>
</body>
</html>


3 forms, 3 iframes, reload/refresh functions can be reduced to, replaced
by a single form.

Tested, valid and working in MSIE 6 for Windows, Opera 7.20, Mozilla
1.5b and NS 7.1:

http://www10.brinkster.com/doctorunc...culations.html

DU
--
Javascript and Browser bugs:
http://www10.brinkster.com/doctorunclear/
- Resources, help and tips for Netscape 7.x users and Composer
- Interactive demos on Popup windows, music (audio/midi) in Netscape 7.x
http://www10.brinkster.com/doctorunc...e7Section.html

Jul 20 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.