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 Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Show/Hide Input type=text when SELECT=Other
- Thread starter NeoTurtle
- Start date
Yeah, I'd like to know how to do that too if it's possible. The trouble is that since the html is already loaded into the browser, you would have to reload the page before you could display more html. You could do that of course, passing all current values that the person has already entered into the new page. Seems kind of messy and user confusing though. You might consider popping up a prompt or a popup window to have them enter a value if they choose other. You can then assign the value of the prompt box/pop up window text box to a hidden input on the page. Not a real clean method either. Then there's the deal with the 'other' situation on the next page idea. Of course it may not fit into your scenario or application design. Even simpler, you could just give them a text box on that page that is disabled until they choose 'other'. Then when they choose 'other' the box can be enabled so they can enter their other value. Or you could use radio buttions instead and show a text box right next to the 'other' choice so they can enter it at that point.
All that talking and I haven't really answered the question! Good luck.
Thessa
All that talking and I haven't really answered the question! Good luck.
Thessa
In order to implement the show hide i have written a function which takes two arguments: the first one being the span id and the other being the name of the select box.
<html>
<head>
<style type="text/css">
.addons {position:relative;visibility:hidden}
</style>
<script language="JavaScript">
<!--
var Ver4 = parseInt(navigator.appVersion) >= 4
var Nav4 = ((navigator.appName == "Netscape"
&& Ver4)
var IE4 = ((navigator.userAgent.indexOf("MSIE" != -1) && Ver4)
function flip(block,sel)
{
if (Nav4){
document.layers[block].visibility=(sel.options[sel.selectedIndex].value=="Other" ? "visible" : "hidden"
}
else if(IE4)
{
document.all(block).style.visibility = (sel.options[sel.selectedIndex].value=="Other" ? "visible" : "hidden"
}
}
//-->
</script>
</head>
<body>
<p>
<select onChange="flip('reasonBlock',this);">
<option selected value="Yes">Yes</option>
<option value="No">No</option>
<option value="Other">Other</option>
</select>
<span ID="reasonBlock" class="addons">
<input name="someName">
</span>
</p>
</body>
</html>
;-)
<html>
<head>
<style type="text/css">
.addons {position:relative;visibility:hidden}
</style>
<script language="JavaScript">
<!--
var Ver4 = parseInt(navigator.appVersion) >= 4
var Nav4 = ((navigator.appName == "Netscape"
&& Ver4)var IE4 = ((navigator.userAgent.indexOf("MSIE"
!= -1) && Ver4)function flip(block,sel)
{
if (Nav4){
document.layers[block].visibility=(sel.options[sel.selectedIndex].value=="Other"
? "visible" : "hidden"}
else if(IE4)
{
document.all(block).style.visibility = (sel.options[sel.selectedIndex].value=="Other"
? "visible" : "hidden"}
}
//-->
</script>
</head>
<body>
<p>
<select onChange="flip('reasonBlock',this);">
<option selected value="Yes">Yes</option>
<option value="No">No</option>
<option value="Other">Other</option>
</select>
<span ID="reasonBlock" class="addons">
<input name="someName">
</span>
</p>
</body>
</html>
;-)
hi!
no'p! this way is not so clear & soft (but i dont know the other way; may be someone else?):
layers in netscrap have their own different document object, so, u wuld have to neste form tags (in every layer (span) u shuld have <form>...</form>) - that means new problems with sendin data 2 server (as i know, only one form might be submited), so, u have 2 create another hidden form in wich u wuld copy all needed values from those forms that are in layers and than submit this one... wooof! looks like i told it
no'p! this way is not so clear & soft (but i dont know the other way; may be someone else?):
layers in netscrap have their own different document object, so, u wuld have to neste form tags (in every layer (span) u shuld have <form>...</form>) - that means new problems with sendin data 2 server (as i know, only one form might be submited), so, u have 2 create another hidden form in wich u wuld copy all needed values from those forms that are in layers and than submit this one... wooof! looks like i told it
- Thread starter
- #6
- Thread starter
- #7
Ok . . . I've been trying to fix this for too long. It works great with just one item like that, but not with 2. I need one for State and Country. I can't seem to get it to work with Country. These are the changes I made for Country:
<select onChange="flip('reasonBlock',this);">
<select onChange="flip('reasonBlock2',this);">
<span ID="reasonBlock" class="addons">
<span ID="reasonBlock2" class="addons">
Any suggenstions??
Thanks in advance,
-Ivan
<select onChange="flip('reasonBlock',this);">
<select onChange="flip('reasonBlock2',this);">
<span ID="reasonBlock" class="addons">
<span ID="reasonBlock2" class="addons">
Any suggenstions??
Thanks in advance,
-Ivan
- Thread starter
- #8
I got it by creating 2 functions. 
<select onChange="flip('reasonBlock',this);">
<select onChange="flip2('reasonBlock2',this);">
<span ID="reasonBlock" class="addons">
<span ID="reasonBlock2" class="addons">
<select onChange="flip('reasonBlock',this);">
<select onChange="flip2('reasonBlock2',this);">
<span ID="reasonBlock" class="addons">
<span ID="reasonBlock2" class="addons">
- Status
Similar threads
- Locked
- Question