There are probably a couple
ways to solve this problem. One solution would be to send two values to the
function...
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function FruitBox(whichfruit, fruitname)
{
window.document.myform.fruit[whichfruit].checked = true;
window.document.myform.fruit.value = fruitname;
}
//--></SCRIPT>
</HEAD>
<BODY>
<FORM NAME="myform">
<INPUT TYPE="radio" NAME="fruit" onClick="window.document.myform.fruit.value
= 'oranges'">Oranges & Tangerines<BR>
<INPUT TYPE="radio" NAME="fruit" onClick="window.document.myform.fruit.value
= 'bananas'">Bananas<BR>
<INPUT TYPE="radio" NAME="fruit" onClick="window.document.myform.fruit.value
= 'peaches'">Peaches, Nectarines & Plums<BR>
To select Oranges <A HREF="javascript:FruitBox(0,'oranges')">click
here</A>.<BR>
To select Bananas <A HREF="javascript:FruitBox(1,'bananas')">click
here</A>.<BR>
To select Peaches <A HREF="javascript:FruitBox(2,'peaches')">click
here</A>.<BR>
To read the current value <A HREF="javascript:alert(window.document.myform.fruit.value)">click
here</A>.
</FORM>
</BODY>
</HTML>
Try it.
See how that works? Keep studying it until you do.
Again, once you get past the most basic scripts, you'll find there are often
several ways to acomplish the same thing. It is very important to understand
that while arguments can be made that one way is better than another, or one
way is less problematic than another, or one way is more efficient than another,
the important thing is that it works. All other discussion falls behind "Does
it get the job done?"
Let's take a small detour and look at this idea of sending a function more than
one variable.
Consider the following...
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT language="javascript"><!--
function DoSomething(item1,item2)
{
alert(item1 + item2)
}
//--></SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript:DoSomething(1,'roses')">Click here</A>
</BODY>
</HTML>
Try it.
We send the function 2 quantities. The function then uses those quantities in
it's execution.
Exercise: Build a script with five links....
Sonny
Tom
Fredo
Michael
Connie
Each link should send the following info to a function... name, age, and favorite
color. When you click on a link, I want an alert box to pop up with a statement
like so...
Sonny is 36 years old and his favorite color is red.
Now, notice that it says "his" favorite color. Connie is female, so
it should read "her" favorite color. Build this script and figure
out a way to solve the his/her problem.
Like I said, there's always more than one way to get the job done.
Alright, let's get back to forms and javascript...
Exercise: Make a form with four radio buttons. Label each of the buttons
with the name of a color. When the user clicks a radio button, the background
color of the page changes accordingly. Hint: although it's often tempting to
place javascript commands right in the link, you may find that this can be a
little limiting. Let's suppose you wanted to add something to the function.
If all the commands are in the link, you'd have to change all the links everytime
you wanted to alter the script. If all the links find a way to point to a function,
all you have to do is play with the function. So, with that in mind, build it
so that the function is what does the work.
| Next>> | ||||||||||||||||||||||||||||||||
|
||||||||||||||||||||||||||||||||