Hi Friends...
In this drop down user will have to select country then the second dropdown will fill automatically by the reference of its country,you can use this code in your html page
In this article we learn how to make a dropdown using html and basic java script
Step 1: Html Code
<html>
<script type="text/javascript">
function deepak(cc) {
var s = document.myform.cities;
s.options.length = 0;
if (cc == "") {
s.options[s.options.length] = new Option('please select of any item ', '');
}
else if (cc == "1") {
s.options[s.options.length] = new Option('jaipur', '');
s.options[s.options.length] = new Option('delhi', '');
}
else if (cc == "2") {
s.options[s.options.length] = new Option('nagashakhi', '');
s.options[s.options.length] = new Option('hiroshima', '');
}
else if (cc == "3") {
s.options[s.options.length] = new Option('karachi', '');
s.options[s.options.length] = new Option('multan', '');
}
}
</script>
<body>
<form name="myform">
<div style="margin-left:550px;margin-top:50px; border:groove 2px #ff6a00; width:250px; height:auto; padding:10px;" >
<select name="option" size="1" onchange="deepak(this.value);">
<option value="">Choose Country</option>
<option value="1">INDIA </option>
<option value="2">JAPAN </option>
<option value="3">PAKISTAN</option>
</select>
<select name="cities" size="1">
</select>
</div>
</form>
</body>
</html>
Your design will look like this
Demo :
0 comments:
Post a Comment