Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Wanet Telecoms Ltd on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Dropdown box question 1

Status
Not open for further replies.

DebbieDavis

Programmer
Jun 7, 2002
146
US
Hello,

I have a dropdown or a textbox I want to display depending on what was selected from the first dropdown. i.e. the first box has two choices, N and V. What I see is the user choosing "V" for example (without clicking a button after making the choice either if possible) then a text box pops up. If they choose "N" a dropdown box pops up. All choices eventually end up in a database. I hope that makes sense. Is this doable? Thanks.
 
unless very needed, you don't need to run anything as far as server side goes for that task.

Some simple avascript additions can do all you need. Just remember that the form objects will still be submitted unless you catch them or set them to disabled (I believe)

here's a bit of a example
Code:
<html>
<head>
<script langauge="javascript">
function showHide(obj) {
if(obj.Text == "N") {
	document.frm.txt.style.visibility = "visible";
	}
	else
		{
		document.frm.sel.style.visibility = "visible";
		}
	}


</script>
</head>
<body>

<form name="frm">

<select onChange="showHide(this);">
 <option> N </option>
 <option> V </option>
</select>


<input type="text" name="txt" style="visibility:hidden;">

<select name="sel" style="visibility:hidden;">
 <option> more choices </option>
 <option> and more </option>
</select>

</Form>


</body>
</html>

Very generic and not really tested but it shoukld get you going in the direction to where you want.

___________________________________________________________________

The answer to your ??'s may be closer then you think.
Check out Tek-Tips knowledge bank by clicking the FAQ link at the top of the page
 
and of course I think I have per your example to my terrible quick write up there, a backwards version of what you stated..

___________________________________________________________________

The answer to your ??'s may be closer then you think.
Check out Tek-Tips knowledge bank by clicking the FAQ link at the top of the page
 
Thanks very much. What if I added an item to that original dropdown, i.e. N, V and L? Sorry so dense, but I'm not very good at javascript... Thanks again.
 
actually I wrote that up wrong on the pointer.
obj.text should be
if(obj.options[obj.selectedIndex].text == "N")

The example above is very useless actually I would say. To use the methods you will need to incorporate the hiding again of the fields etc...

But to answer, it will just add a conditioning statement to the function..or even in some case having a routine for the one task of hiding/showing the fields, a routine for catching the text/value and another to set the others to disabled so they are not passed to the form collection.

So if you wanted to make it fairly basic (but slow in javascript sense) you would add another value to check as
Code:
function showHide(obj) {
if(obj.options[obj.selectedIndex].text == "N") {
	document.frm.txt.style.visibility = "visible";
	}
if(obj.options[obj.selectedIndex].text == "N") {
	document.frm.sel.style.visibility = "visible";
	}
if(obj.options[obj.selectedIndex].text == "L") {
	document.frm.(another field.style.visibility = "visible";
	}

}

there are much faster and more stable (browser compatible) ways to do this though. Try searching for ("show hide javascript") on gogole.com and I bet you get tons of different methods.


___________________________________________________________________

The answer to your ??'s may be closer then you think.
Check out Tek-Tips knowledge bank by clicking the FAQ link at the top of the page
 
I found this little snippet of code, but I must retain my URL which has additional variables in the querystring.

<form action="">
<select name="LC" onchange="this.form.submit();">
<option>LC</option>
<option value="V">V</option>
<option value="N">N</option>
<option value="L">L</option>
</select>
</form>

It works but produces default.asp?LC=V and that would be ok if I didn't rely on the other members of the querystring. If I use my current querystring with name="LC" I get the following:


The = and ? are the ascii codes instead of = and ?. Any thoughts about this? Many thanks again!!
 
Hi Onpnt, I actually named the form and changed the onsubmit statement a little and it worked ok. Many thanks again for your input.

<form name="form_LC" method="post" action ="?select=81&customer=<%=Request.QueryString("customer")%>&continue=<%=Request.QueryString("continue")%>">
<select name="LC" onChange="document.forms['form_LC'].submit()">
<option selected>Choice</option>
<option value=V>V</option>
<option value=N>N</option>
<option value=L>L</option>
</select>
</form>
 
[thumbsup2]

___________________________________________________________________

The answer to your ??'s may be closer then you think.
Check out Tek-Tips knowledge bank by clicking the FAQ link at the top of the page
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top