I want to create something like that:
3.bp.blogspot.com/-RlGu3mmu6jA/URJdWWtt9XI/AAAAAAAADoU/ryaRZ3DKkzc/s1600/1.gif
but without ASP.NET.
Is that possible somehow?
1
-
If you have only a couple possible options then you can easily do that with javascript.Dimitri– Dimitri2014-03-18 20:23:39 +00:00Commented Mar 18, 2014 at 20:23
Add a comment
|
2 Answers
As others have stated, you can easily use client-side code such as Javascript.
Here is an example using Javascript and jQuery: http://jsfiddle.net/ET5JW/9/
HTML:
<label for="firstBox">First Select</label>
<select id="firstBox">
<option value="">Select Option...</option>
<option value="a">A</option>
<option value="b">B</option>
</select>
<br />
<div id="secondBox_frame" style="display:none;">
<label for="secondBox">Second Select</label>
<select id="secondBox">
<option value="">Use first box first</option>
</select>
</div>
Javascript (with jQuery):
var options = new Array("a","b");
options["a"] = new Array("1a","2a","3a");
options["b"] = new Array("1b","2b","3b");
$("#firstBox").change(function(){
if ($("#firstBox").val()) {
$("#secondBox").html('');
var selectedOptions = options[$("#firstBox").val()];
for (var i in selectedOptions) {
$("#secondBox").append('<option value="'+selectedOptions[i]+'">'+selectedOptions[i]+'</option>');
}
$("#secondBox_frame").fadeIn(400);
}
else {
$("#secondBox").html('<option value="">Use first box first</option>');
$("#secondBox_frame").fadeOut(400);
}
});
If you are interested in doing this server-side PHP could help.
2 Comments
user3433505
Thanks so much, just what I was after. Is it possible to display the second dropdown list only after the first dropdown list was used?
Sean
@user3433505, I updated it to include the show/hide you asked for.
Is that possible somehow?
yes, um ... but what language do you want to use? do you want something like that for a web page (here)? or in an desktop programm (e.g. java - swing)? android/iOS app ?
