473,395 Members | 1,692 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,395 software developers and data experts.

Show/Hide text and form field based on drop down selection

Hi

I'm trying to show/hide a simple piece of text and a text field on a
form based on what choice is made from a drop down box.

<select name="dropdown" size="1">
<option selected value="">Please make a selection</option>
<option value="1">Choice 1</option>
<option value="2">Choice 2</option>
<option value="3">Choice 3</option>
<option value="4">Other</option>
</select>

i.e. if Choice 2 is selected I'd like to display a new <tr> with the
following:

<tr>
<td>New text field:</td>
<td><input name="newField" type="text size="20"></td>
</tr>

if any other choices are made, I don't want to display anything.
I've tried several onchange() functions but can't achieve what I'm
looking for.

Any help would be appreciated,
Steve
Jul 20 '05 #1
6 148500
Steve,
Did you ever get a response to your request? I need to do something similar. Please email me at ljhibbard@doit.nv.gov.
Thanks.
Linda
Aug 10 '05 #2
MrK
1
Try this script. It will hide/show table rows based on a selection. you can put whatever you want in the tbody areas.





<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Show/Hide</title>
<script type="text/javascript">
// <![CDATA[
function display(obj,id1,id2) {
txt = obj.options[obj.selectedIndex].value;
document.getElementById(id1).style.display = 'none';
document.getElementById(id2).style.display = 'none';
if ( txt.match(id1) ) {
document.getElementById(id1).style.display = 'block';
}
if ( txt.match(id2) ) {
document.getElementById(id2).style.display = 'block';
}
}
// ]]>
</script>
</head>

<body>
<table width="340" cellspacing="0" cellpadding="2">
<thead>
<tr>
<td class="title">Type:</td>
<td class="field">
<select name="type" onchange="display(this,'text','image');">
<option>Please select:</option>
<option value="image">Image</option>
<option value="text">Texts</option>
<option value="invisible">Invisible</option>
</select>
</td>
</tr>
</thead>
<tfoot>
<tr>
<td class="align-center" colspan="2"><input type="submit" name="submit" value="Update" /> <input type="reset" value="Reset" /></td>
</tr>
</tfoot>
<tbody id="text" style="display: none;">
<tr>
<td class="title">Text Color:</td>
<td class="field"><input type="text" name="color" size="8" maxlength="7" /></td>
</tr>
</tbody>
<tbody id="image" style="display: none;">
<tr>
<td class="title">Image:</td>
<td class="field"><input type="file" name="image" size="10" /></td>
</tr>
<tr>
<td class="title">X Coordinates:</td>
<td class="field"><input type="text" name="x_coordinates" size="5" /></td>
</tr>
<tr>
<td class="title">Y Coordinates:</td>
<td class="field"><input type="text" name="y_coordinates" size="5" /></td>
</tr>
<tr>
<td class="title">Text Color:</td>
<td class="field"><input type="text" name="color" size="8" maxlength="7" /></td>
</tr>
</tbody>
<tbody>
<tr>
<td class="title">Display:</td>
<td class="field">
<select name="display">
<option value="visitors">Visitors</option>
<option value="hits">Hits</option>
</select>
</td>
</tr>
</tbody>
</table>
</body>
</html>
Feb 16 '06 #3
Thanks for the JScript. It worked well for me
Mar 23 '06 #4
Allan
1
Thanks for the JScript. It worked well for me
Hello,

I'm having the same problem, I'm working with xsl, but it should be +/- the same.
The update and reset doesn't do anything, does it?
I mean, the whole example doesn't do anything but show the dropdown and the buttons, right?

And can you post your example too please?
Mar 29 '06 #5
nausa
1
This code would also work great for me except if I put it in a form tags

<form></form> in order to send it to an email box to get the field values the code stops working. Is there any way to get this code to work with adding the form tags in or is there another way to send the form to an email without having the form tags.

Thanks,
Amy
Apr 14 '06 #6
what if i want to show/hide a dropdown menu after choosing from the selection and replaces it by another dropdown menu?

For example:

Here's the first dropdown menu:
<select name="signalling">
<option value="fx">FX?</option>
<option value="pri">PRI</option>
</select>

after choosing FX? option, it will disappear and then replaces by another dropdown menu.

Here's the second dropdown menu that should appear:
<select name="fx">
<option value="fx0">FX0</option>
<option value="fxs">FXS</option>
</select>

And ofcourse, it should have a reset button to return to its original state which hides the second dropdown menu and be replaced by the first one.

Hope that you could help me on this.

Thanks a lot!
Jun 10 '06 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: InvisibleMan | last post by:
Hi, Thanks in advance... I want to test two form fields: ConversionValue (text field) convert (Select Dropdown: Index 0 = True - 1 = False) Essentially, If ConversionValue is Blank,...
2
by: Sybre | last post by:
I have a script which reads a file and generates a list for a drop-down selection box. However, I want to be able to change which option is selected when certain buttons are clicked - how can I do...
1
by: bvlmv | last post by:
Hello, relatively new to programming and just trying to create a simple asp page. I have the following drop down menu on a html page and when submitting i would like to call out on asp what someone...
6
by: bvlmv | last post by:
Hello, relatively new to programming and just trying to create a simple asp page. I have the following drop down menu on a html page and when submitting i would like to call out on asp what...
2
by: bbatson | last post by:
Hello, Does anyone have any advice as to how to limit a drop-down selection in a table? For example, suppose I have two tables - essentially a one-to-many relationship. One table is...
3
by: steveninfl | last post by:
Hello , I am using MS Access 2000. I have a Table called Transactions, I have created a form for this table, one of the fields on the form is a combo box with the row source type as value list. In...
6
by: Palehorse | last post by:
I'd like to apologize upfront for me saying "I'm not a programer", I'm sure you all hear this a hundred times a day. Unfortunately, in this case, it's true. I've been working on trying to figure out...
0
by: So Confused | last post by:
I have a drop down selection menu on an HTML form. I want to display 1 answer, for a few selection options.... and another answer for the rest of the options. Example code is below: How Much...
0
by: Alex Fung | last post by:
When I use GotFree Cards (http://www.got-free-ecards.com) to send free e-cards, I come across a problem when selecting the future date for sending the card. The webpage uses javascript and the...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.