468,484 Members | 2,040 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,484 developers. It's quick & easy.

Display 2nd Textbox when option selected

I have a select box with about 5 options.
I need to have one of the options, when selected, display a second select
box.
The second select box is populated by a database and needs to be preloaded
so the page doesnt refresh.

How can this be done?

I guess could have the second select box displayed but disabled and it would
become active once the option is selected on the first select box.

I just have no idea how to do this.

Thanks in advance!


Jul 23 '05 #1
2 2338


Targa wrote:
I have a select box with about 5 options.
I need to have one of the options, when selected, display a second select
box.
The second select box is populated by a database and needs to be preloaded
so the page doesnt refresh.

How can this be done?

I guess could have the second select box displayed but disabled and it would
become active once the option is selected on the first select box.

I just have no idea how to do this.


HTML 4 knows an attribute named disabled for HTML form controls, it is
scripted as the property of the same name so to have a form that enables
a select if a certain option of another select is selected have a look
at the following example:

<html>
<head>
<title>disabling/enabling a form control</title>
</head>
<body>
<form name="formName">
<select name="select1"
onchange="if (this.selectedIndex == 3) {
this.form.elements.select2.disabled = false;
}
else {
this.form.elements.select2.disabled = true;
}">
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
</select>
<select name="select2">
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
</select>
<script type="text/javascript">
document.forms.formName.elements.select2.disabled = true;
</script>
</form>
</body>
</html>

Note that script is used to disable the select initially as a select
disabled statically with HTML would mean the user needs JavaScript
enabled to make use of the form.
--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #2
Excellent example!
Worked perfectly for me - Thanks!
"Martin Honnen" <ma*******@yahoo.de> wrote in message
news:40******@olaf.komtel.net...


Targa wrote:
I have a select box with about 5 options.
I need to have one of the options, when selected, display a second select box.
The second select box is populated by a database and needs to be preloaded so the page doesnt refresh.

How can this be done?

I guess could have the second select box displayed but disabled and it would become active once the option is selected on the first select box.

I just have no idea how to do this.


HTML 4 knows an attribute named disabled for HTML form controls, it is
scripted as the property of the same name so to have a form that enables
a select if a certain option of another select is selected have a look
at the following example:

<html>
<head>
<title>disabling/enabling a form control</title>
</head>
<body>
<form name="formName">
<select name="select1"
onchange="if (this.selectedIndex == 3) {
this.form.elements.select2.disabled = false;
}
else {
this.form.elements.select2.disabled = true;
}">
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
</select>
<select name="select2">
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
<option>option 5</option>
</select>
<script type="text/javascript">
document.forms.formName.elements.select2.disabled = true;
</script>
</form>
</body>
</html>

Note that script is used to disable the select initially as a select
disabled statically with HTML would mean the user needs JavaScript
enabled to make use of the form.
--

Martin Honnen
http://JavaScript.FAQTs.com/


Jul 23 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

4 posts views Thread by kindermaxiz | last post: by
19 posts views Thread by dmiller23462 | last post: by
3 posts views Thread by Iain Hallam | last post: by
5 posts views Thread by =?Utf-8?B?R1ROMTcwNzc3?= | last post: by
reply views Thread by theflame83 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.