Script Help

**McKirahan** · Jul 23 '05, 02:48 PM

Re: Script Help

"Brian" <joe@joe.com> wrote in message news:2tl8daF221 bhoU1@uni-berlin.de...[color=blue]
> Help..
>
> We cannot get this script to work..can someone take a look at it and make
> suggestions?
>[/color]

[snip]

<html>
<head>
<title>Conver t Temperature</title>
<script type="text/javascript">
function convert_celcius () {
var what = document.getEle mentById("fahre nheit").value;
var temp = (what - 32) * 5 / 9;
document.getEle mentById("celci us").value = temp;
return what + " C = " + temp + " F";
}
function convert_fahrenh eit() {
var what = document.getEle mentById("celci us").value;
var temp = (what * 1.8) + 32;
document.getEle mentById("fahre nheit").value = temp;
return what + " F = " + temp + " C";
}
</script>
</head>
<body>
<pre>
<h1>Convert Temperature</h1>
<h3>Enter the temperature in Celcius</h3>
<input type="text" name="celcius">
<input type="button" value="Convert to Fahrenheit"
onClick="alert( convert_fahrenh eit())">
<br />
<h3>Enter the temperature in Fahrenheit</h3>
<input type="text" name="fahrenhei t">
<input type="button" value="Convert to Celcius"
onClick="alert( convert_celcius ())">
</pre>
</body>
</html>

**Michael Winter** · Jul 23 '05, 02:48 PM

Re: Script Help

On Tue, 19 Oct 2004 14:30:12 -0500, Brian <joe@joe.com> wrote:
[color=blue]
> Help..
>
> We cannot get this script to work..[/color]

In future, please explain what you mean. We can't read minds: you need to
state what *should* occur, what *does* occur, and possibly why that's a
problem.

As things stand, the reasons are clear, here.
[color=blue]
> can someone take a look at it and make suggestions?[/color]

Certainly.
[color=blue]
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">[/color]

You should include the URL.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Omitting it can fail to switch some browsers into "strict rendering" mode.

[snip]
[color=blue]
> <script language="javas cript">[/color]

The language attribute has been deprecated for several years now. Instead,
use the (required) type attribute.

<script type="text/javascript">
[color=blue]
> [/color]

This should be deleted along with the other SGML comment delimiter.
[color=blue]
> </script>
> </head>
> <body><pre>[/color]

Why a PRE element? I don't see any preformatted text.
[color=blue]
> <h1>Convert Temperature</h1>
> <h3>Enter the temperature in Celcius</h3>[/color]

You shouldn't skip heading levels. If you want to change the style of a
heading, use CSS.
[color=blue]
> <input type="text" name="fahrenhei t"
> onChange="fahre nheit.value";>[/color]

That doesn't do anything. It also suffers from the "bad referencing",
earlier.

For future reference, code inside an intrinsic event can use the this
operator to refer to the current element.
[color=blue]
> <input type="button" value="Convert to Celcius"
> onClick="alert( 'Converted to celcius' + convert_celcius[])";>[/color]

Functions are called using parentheses, not square brackets.
[color=blue]
> <br />[/color]

You're not writing XHTML, so the slash above is invalid.

From this point on, the mistakes above are repeated.

[snip]

Here's a reworked version of your page:

<URL:http://www.mlwinter.pw p.blueyonder.co .uk/clj/brian/basic.html>

It also includes input validation (will accept integers, reals, and
scientific notation) and number formatting (currently set to display 2
decimal places - the toFixed function handles that).

You'll probably want to ignore the isReal and toFixed functions at the
moment. They aren't really readable. If you want to see the effects of
toFixed, the arguments are:

n - The number to format.
p - The number of decimal places to display. Rounding is performed
automatically. The number here must be no less than 0, and no
more than 20 (the default is zero - return an integer).
g - The grouping symbol to use every three digits (the default is
no symbol).

For example,

toFixed(1234.56 , 1, ',')

will produce the string, "1,234.6".

Hope that helps,
Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

**Michael Winter** · Jul 23 '05, 02:48 PM

Re: Script Help

On Tue, 19 Oct 2004 19:59:00 GMT, McKirahan <News@McKirahan .com> wrote:

[snip]
[color=blue]
> var what = document.getEle mentById("fahre nheit").value;[/color]

[snip]
[color=blue]
> <input type="text" name="fahrenhei t">[/color]

Mind explaining that, please?

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

**McKirahan** · Jul 23 '05, 02:48 PM

Re: Script Help

"Michael Winter" <M.Winter@bluey onder.co.invali d> wrote in message
news:opsf4zjctt x13kvk@atlantis ...[color=blue]
> On Tue, 19 Oct 2004 19:59:00 GMT, McKirahan <News@McKirahan .com> wrote:
>
> [snip]
>[color=green]
> > var what = document.getEle mentById("fahre nheit").value;[/color]
>
> [snip]
>[color=green]
> > <input type="text" name="fahrenhei t">[/color]
>
> Mind explaining that, please?
>
> [snip]
>
> Mike
>
> --
> Michael Winter
> Replace ".invalid" with ".uk" to reply by e-mail.[/color]

What is your question?

I suppose you are suggesting that I use "id=";
I tested this under IE which supports "name=".

Or did you want a reference to a form field?

Would you prefer the following?

<html>
<head>
<title>Conver t Temperature</title>
<script type="text/javascript">
function convert_celcius () {
var what = document.getEle mentById("fahre nheit").value;
var temp = (what - 32) * 5 / 9;
document.getEle mentById("celci us").value = temp;
return what + " F = " + temp + " C";
}
function convert_fahrenh eit() {
var what = document.getEle mentById("celci us").value;
var temp = (what * 1.8) + 32;
document.getEle mentById("fahre nheit").value = temp;
return what + " C = " + temp + " F";
}
</script>
</head>
<body>
<pre>
<h1>Convert Temperature</h1>
<h3>Enter the temperature in Celcius</h3>
<input type="text" id="celcius">
<input type="button" value="Convert to Fahrenheit"
onClick="alert( convert_fahrenh eit())">
<br />
<h3>Enter the temperature in Fahrenheit</h3>
<input type="text" id="fahrenheit" >
<input type="button" value="Convert to Celcius"
onClick="alert( convert_celcius ())">
</pre>
</body>
</html>

Note that the "return" statements were switched from before.

**Michael Winter** · Jul 23 '05, 02:49 PM

Re: Script Help

On Wed, 20 Oct 2004 09:53:30 GMT, McKirahan <News@McKirahan .com> wrote:

[snip]
[color=blue]
> I suppose you are suggesting that I use "id=";[/color]

You have to!
[color=blue]
> I tested this under IE which supports "name=".[/color]

Incorrectly.
[color=blue]
> Or did you want a reference to a form field?[/color]

That would do just as well. Probably better, in fact.
[color=blue]
> Would you prefer the following?[/color]

Yes. :)

[snip]

Mike

--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.

**Randy Webb** · Jul 23 '05, 02:49 PM

Re: Script Help

McKirahan wrote:

<--snip-->
[color=blue]
>
> What is your question?
>
> I suppose you are suggesting that I use "id=";[/color]

Personally, I would use name= and the forms collection.
[color=blue]
> I tested this under IE which supports "name=".[/color]

IE supports a lot of things that isn't cross-browser. Thats why it sucks
as a test browser.
[color=blue]
> Or did you want a reference to a form field?[/color]

Thats more cross-browser and more backwards compatible.
[color=blue]
> Would you prefer the following?[/color]

No, see the notes.
[color=blue]
> <html>
> <head>
> <title>Conver t Temperature</title>
> <script type="text/javascript">
> function convert_celcius () {
> var what = document.getEle mentById("fahre nheit").value;[/color]

var what = document.forms['formName'].elements['farenheit'].value;

[color=blue]
> var temp = (what - 32) * 5 / 9;
> document.getEle mentById("celci us").value = temp;[/color]

var what = document.forms['formName'].elements['celsius'].value = temp;
[color=blue]
> return what + " F = " + temp + " C";
> }
> function convert_fahrenh eit() {
> var what = document.getEle mentById("celci us").value;[/color]

var what = document.forms['formName'].elements['celcius'].value;
[color=blue]
> var temp = (what * 1.8) + 32;
> document.getEle mentById("fahre nheit").value = temp;[/color]

var what = document.forms['formName'].elements['farenheit'].value = temp;

[color=blue]
> return what + " C = " + temp + " F";
> }
> </script>
> </head>
> <body>
> <pre>
> <h1>Convert Temperature</h1>
> <h3>Enter the temperature in Celcius</h3>[/color]

<form name="formName" action="">
[color=blue]
> <input type="text" id="celcius">[/color]

<input type="text" name="celcius">
[color=blue]
> <input type="button" value="Convert to Fahrenheit"
> onClick="alert( convert_fahrenh eit())">
> <br />
> <h3>Enter the temperature in Fahrenheit</h3>
> <input type="text" id="fahrenheit" >[/color]

<input type="text" name="fahrenhei t">
[color=blue]
> <input type="button" value="Convert to Celcius"
> onClick="alert( convert_celcius ())">[/color]

<form>

Drop the pre's

--
Randy
comp.lang.javas cript FAQ - http://jibbering.com/faq

Script Help

Script Help

Comment

Comment

Comment

Comment

Comment

Comment