Show/hide inputs?

  • 1
  • Question
  • Updated 10 years ago
  • Answered
How can I show/hide an input box?

1 input box
-- Add another input box (link for show/hide input)

The simplest code to work with would be preferred
Photo of Donald


  • 2991 Posts
  • 37 Reply Likes

Posted 10 years ago

  • 1
Photo of Marije


  • 4636 Posts
  • 237 Reply Likes
Hi Donald - I'm not familiar with what you're looking for. I'm going to ask one of my colleagues to assist you when they're next online...
Photo of Boomer

Boomer, Champion

  • 2055 Posts
  • 84 Reply Likes
This is the simplest one I've found.
It toggles 3 divs using radio buttons. You can modify it to suite.

<style type="text/css">#Div1, #Div2, #Div3{ display: none; }</style>

<script type="text/javascript">
function toggle(theDiv) {
document.getElementById("Div1").style.display = "none";
document.getElementById("Div2").style.display = "none";
document.getElementById("Div3").style.display = "none";
document.getElementById(theDiv).style.display = "block";

<input type="radio" name="whatever" value="whatever" onclick="toggle('Div1')">
<input type="radio" name="whatever" value="whatever" onclick="toggle('Div2')">
<input type="radio" name="whatever" value="whatever" onclick="toggle('Div3')">

<div id="Div1">Your content 1</div>
<div id="Div2">Your content 2</div>
<div id="Div3">Your content 3</div>

I use it all the time...
Photo of Sanja


  • 10698 Posts
  • 495 Reply Likes
Thanks Boomer!

Donald.. I hope that Boomer's suggestion is what you were looking for.
Photo of Donald


  • 2991 Posts
  • 37 Reply Likes
thanks Boomer, I will try that!
Photo of INDI


  • 189 Posts
  • 2 Reply Likes
Ok for such a dummy like myself, what realistically does all that code end up showing at the end of the day ??? What is "show/hide" inputs ???

Boomer since you use this all the time, what on earth is all that mumbo jumbo divs, docs, elements, etc

Good grief, one day soon in the near future I can learn what all this means....
Photo of Donald


  • 2991 Posts
  • 37 Reply Likes
are you aware of what an input is?

An input is a box, such as in a register form, the box next to the question is an input.

A show/hide, shows or hides another one.

Say for instance I wanted to create a contact form, and I wanted to add...

box for first name, last name, box for category, and box for sub-category, but I wanted to simplify things and make last name and sub category optional. I can use a link that says, "Add last name" and "Add sub category" and a show/hide, by clicking that link, will display another box for them to fill out - not quite what I wanted the code for but easiest example I could come up with.
Photo of Donald


  • 2991 Posts
  • 37 Reply Likes
Boomer, you have any php knowledge I can talk with you about? Either by email or here I don't care!