By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,028 Members | 1,945 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,028 IT Pros & Developers. It's quick & easy.

Display 2nd Textbox when option selected

P: n/a
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
Share this Question
Share on Google+
2 Replies


P: n/a


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

P: n/a
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.