Understanding the writing method of switch/case

[Richard]

I am slowly understanding how this all comes together and feel it is an
answer to my needs.
By using a form with an image as my input, I can assign a value to the
image.
That I can not do with an image alone.
What I need to know is, what do I need to use in replace of the alert(msg)
so that the larger image and description appear below the thumbnails as
desired?

switch(buttonNa me.value) {
case "101":
alert("huh?")
break

<form action="#">
<input type="image" src="images/thmb001.jpg" value="101"
onclick="saySom ething(this)" />
</form>

This was shown as an xhtml document.

At least this much of it works.

[Janwillem Borleffs]

Re: Understanding the writing method of switch/case

Richard wrote:[color=blue]
> At least this much of it works.[/color]

As would the following, but without the switch overhead:

// Define messages
var msg101 = 'Huh?';
var msg102 = 'Huh????';
// etc
....
....
<form action="#">
<input type="image" src="images/thmb001.jpg" value="101"
onclick="alert( window['msg' + this.value]);return false" />
</form>

And remember that you can also use the alt attribute for this purpose...


JW

[Richard]

Re: Understanding the writing method of switch/case

On Sun, 30 Jan 2005 11:34:46 +0100 Janwillem Borleffs wrote:
[color=blue]
> Richard wrote:[color=green]
>> At least this much of it works.[/color][/color]
[color=blue]
> As would the following, but without the switch overhead:[/color]
[color=blue]
> // Define messages
> var msg101 = 'Huh?';
> var msg102 = 'Huh????';
> // etc
> ...
> ...
> <form action="#">
> <input type="image" src="images/thmb001.jpg" value="101"
> onclick="alert( window['msg' + this.value]);return false" />
> </form>[/color]
[color=blue]
> And remember that you can also use the alt attribute for this
> purpose...[/color]

[color=blue]
> JW[/color]

Thanks, that could work even better.

[Richard]

Re: Understanding the writing method of switch/case

On Sun, 30 Jan 2005 11:34:46 +0100 Janwillem Borleffs wrote:
[color=blue]
> Richard wrote:[color=green]
>> At least this much of it works.[/color][/color]
[color=blue]
> As would the following, but without the switch overhead:[/color]
[color=blue]
> // Define messages
> var msg101 = 'Huh?';
> var msg102 = 'Huh????';
> // etc
> ...
> ...
> <form action="#">
> <input type="image" src="images/thmb001.jpg" value="101"
> onclick="alert( window['msg' + this.value]);return false" />
> </form>[/color]
[color=blue]
> And remember that you can also use the alt attribute for this
> purpose...[/color]

[color=blue]
> JW[/color]

Now what would I need to do to print the result to the same page?
My idea is to write a description above the larger image all on the same
page.

https://www.somestuff.batcave.net/menu1.html

[Randy Webb]

Re: Understanding the writing method of switch/case

Richard wrote:[color=blue]
> I am slowly understanding how this all comes together and feel it is an
> answer to my needs.[/color]

Its not. You just think it is.
[color=blue]
> By using a form with an image as my input, I can assign a value to the
> image.
> That I can not do with an image alone.[/color]

Sure you can. You just don't know how to do it.
[color=blue]
> What I need to know is, what do I need to use in replace of the alert(msg)
> so that the larger image and description appear below the thumbnails as
> desired?[/color]

Code that will change the image source and the text of a div tag. Search
the archives and the FAQ and you will find what you are hunting.
[color=blue]
> switch(buttonNa me.value) {
> case "101":
> alert("huh?")
> break
>
> <form action="#">
> <input type="image" src="images/thmb001.jpg" value="101"
> onclick="saySom ething(this)" />
> </form>
>
> This was shown as an xhtml document.
>
> At least this much of it works.[/color]

No, you just think it works.

function changeImage(ima geName,imageSou rce,divName,div Text){
document.images[imageName].src=imageSourc e;
document.getEle mentById(divNam e).innerHTML = divText;
}

And you call it as such:

changeImage('im age1','image1Bi gImage.gif','te xtDiv','Text to place in
the div goes here')

All of that can be made even simpler using an array and passing its
index. But *NONE* of it requires a switch/case construction.



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

[Richard]

Re: Understanding the writing method of switch/case

Ok. So why do I keep getting errors when onclick is executed?
One time it says "/" expected at character 47, another time at character 26.
Now it tells me thmb002.jpg is undefined at character 1.
This is why I do not understand JS. To many ways to get an error and no
explanations.


function changeImage(ima geName,imageSou rce,divName,div Text){
document.images[imageName].src=imageSourc e;
document.getEle mentById(divNam e).innerHTML = divText;
}

</script>

<form action="#">
<input type="image" src="images/thmb001.jpg" value="101"
onclick="change Image(main,imag es/thmb002.jpg,sam ple,'hello')">
</form>

<div id="sample" >

<img src="images/saturn.gif" name="main">

</div>

[Randy Webb]

Re: Understanding the writing method of switch/case

Richard wrote:[color=blue]
> Ok. So why do I keep getting errors when onclick is executed?[/color]

Because you did not quote it properly. Re-read my example onclick:

changeImage('im age1','image1Bi gImage.gif','te xtDiv','Text to place in
the div goes here')

See the quotes around image1 that you do not have around your main?
[color=blue]
> One time it says "/" expected at character 47, another time at character 26.
> Now it tells me thmb002.jpg is undefined at character 1.[/color]

Since it is not quoted, the JS parser assumes that to be a variable
name. Since that variable is not defined, you get the error.
[color=blue]
> This is why I do not understand JS. To many ways to get an error and no
> explanations.[/color]

There is always an explanation for an error. You just don't understand
how to go about finding the errors/cause.
[color=blue]
>
> function changeImage(ima geName,imageSou rce,divName,div Text){
> document.images[imageName].src=imageSourc e;
> document.getEle mentById(divNam e).innerHTML = divText;
> }
>
> </script>
>
> <form action="#">
> <input type="image" src="images/thmb001.jpg" value="101"
> onclick="change Image(main,imag es/thmb002.jpg,sam ple,'hello')">[/color]

onclick="change Image('main','i mages/thmboo2.jpg','s ample','hello') "
[color=blue]
> </form>
>
> <div id="sample" >
>
> <img src="images/saturn.gif" name="main">
>
> </div>[/color]

<div id="sample"></div>
<img src="images/saturn.gif" name="main" height="XX" width="XX" alt="XXXXX">


P.S. Still no switch/case in the construct.

--
Randy

[Michael Winter]

Re: Understanding the writing method of switch/case

On Sun, 30 Jan 2005 12:10:48 -0600, Richard <Anonymous@127. 001> wrote:
[color=blue]
> Ok. So why do I keep getting errors when onclick is executed?[/color]

Because out of four (what should be) string literals, you've only quoted
one.

[snip]
[color=blue]
> This is why I do not understand JS.[/color]

It's tempting...

[snip]

Mike

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

[Richard Cornford]

Re: Understanding the writing method of switch/case

Richard wrote:[color=blue]
> Ok. So why do I keep getting errors when onclick is executed?[/color]

That is a silly question really. For as long as you believe you can
employ a technology without first learning that technology you will get
many errors and not understand why. The general tolerance of tag soup
browsers might allow you to get away with disregarding the technical
details of HTML but programming languages cannot be that lax.
[color=blue]
> One time it[/color]

What it "it"?
[color=blue]
> says "/" expected at character 47, another time at
> character 26.[/color]

That is extremely unlikely to be all that "it" says.
[color=blue]
> Now it tells me thmb002.jpg is undefined at character 1.[/color]

The identifier - thmb001 - in the property accessor - thmb001.jpg - is
probably undefined.
[color=blue]
> This is why I do not understand JS.[/color]

No it isn't. You don't understand javascript because you have not
attempted to learn the language before attempting to use it. (Though it
may be that you are too stupid to understand computer programming
anyway. You certainly haven't grasped that it is inappropriate to
attempt to give advice to others until you have understood tat least the
basics).
[color=blue]
> To many ways to get an error and
> no explanations.[/color]

You have been given an explanation by whatever "it" was. You have
apparently disregarded part of that explanation and not understood its
meaning, but the explanation was given.
[color=blue]
> function changeImage(ima geName,imageSou rce,divName,div Text){
> document.images[imageName].src=imageSourc e;
> document.getEle mentById(divNam e).innerHTML = divText;
> }
>
> </script>
>
> <form action="#">
> <input type="image" src="images/thmb001.jpg" value="101"
> onclick="change Image(main,imag es/thmb002.jpg,sam ple,'hello')">[/color]
<snip>

<input type="image"> elements do not appear in the - document.images -
collection; only IMG elements do (as is stressed in the W3C HTML DOM
specification). They are also almost certainly an inappropriate choice
of element to use for this task. For one thing, uncancelled, clicking on
such an element will submit the form that contains it.

Richard.