Make info visible/invisible based on radio button

On a form, how do I make data visible/invisible based on a radio button (ir a check box).  For example, a form that is gathering info for a travel reservation request.  if the user chooses YES for NEED A RENTAL CAR?, they would see info related to car rental choices.  If they then click NO, the info disappears.  All this needsto take place on a single form.
birosraAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

aarieCommented:
If you use a checkbox, you could do the following:

-----

<html>
<head>
<script language="javascript">
function RentalInfo()
{
 with(document.forms[0])
   {
    if (rentalcar.checked)
      {
      // Change the value of the textarea.
       rentalcarinfo.value = "Info on rental cars.\nContact us at ... ";
      } // end if
    else
      {
      // Empty the textarea.
        rentalcarinfo.value = "";
      } // end else

    // remove focus from the checkbox
    rentalcar.blur();
   } // end with
} // end RentalInfo
</script>
</head>
<body>
<form>
Check this box for rental car info : <input type="checkbox" name="rentalcar"

onClick="RentalInfo();"><br>
<textarea name="rentalcarinfo" cols="50" rows="5">
</textarea>
</form>
</body>
</html>

------

Off course, this surely isn't the only way to solve your problem, maybe not even the best, but it is a way to solve it. In the RentalInfo function, you can change the text that needs to be shown. The number of characters per line and the number of textlines can be changed to fit your need. Make sure you use escape characters (like \n \t \") for text markup.

Arjan.
0
birosraAuthor Commented:
Adjusted points to 160
0
dspletsCommented:
The following program works perfect for IE.  In Netscape it's impossible to change content on-the-fly.

<html>

<head>

<title>New Page 1</title>
</head>

<body>

<form method="POST">
   <p><input type="radio" value="V1" name="R1" onclick="More.style.display=''">Yes<br>
  <input type="radio" name="R1" value="V2" onclick="More.style.display='none'">No</p>
  <p>&nbsp;</p>
<!-- This division contains the hidden part of the form that the user sees when they click on More>>. The event handler at the top of this file shows the layer. -->
  <div id="More" style="display:none"><table CELLPADDING="10">
    <tr>
      <td><b>Type the URL of your home page:</b><br>
      <input NAME="FEEDBACK_URL" TYPE="TEXT" SIZE="60"> </td>
      <td><b>Type your phone number:</b><br>
      <input NAME="FEEDBACK_PHONE" TYPE="TEXT" SIZE="32"> </td>
    </tr>
  </table>
  </div>

</form>

</body>

</html>
 
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Cloud Class® Course: Amazon Web Services - Basic

Are you thinking about creating an Amazon Web Services account for your business? Not sure where to start? In this course you’ll get an overview of the history of AWS and take a tour of their user interface.

aarieCommented:
dsplets' proposed answer is another way to solve your problem... I haven't tested my solution with netscape, but I do think it'll work in netscape as well.... I think the layer version is more elegant, as you can make it visible only when the checkbox is checked.... In netscape, instead of the div tag you might better try to use the LAYER tag, and the visibility property instead of display....

By the way, dsplets, by posting your IE only answer, you are discouraging other people to engage in the discussion. They might know of a way which actually is cross browser. But then again, nothing said if IE is the browser which needs to be supported.

Arjan.
0
birosraAuthor Commented:
dsplets solution is a good one for IE.
Will it work in Netscape?
Is there a cross browser solution?
Will the <div> tag work in Netscape or is it an IE only solution.
0
dspletsCommented:
No, it doesn't work in NS.  I believe there is no cross browser solution. Even with layers you can't achieve the same effect.
The div tag works in NS and in IE but like I said you can't change content on the fly.  The part More.style.display won't work in NS.  

 
0
aarieCommented:
birosra, for a netscape version go to developer.netscape.com/docs
there you can find a javascript reference. In it, they describe how to make a layer visible or invisible!

Arjan.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Development Software

From novice to tech pro — start learning today.