daveVk
msg:4548278 | 1:35 am on Feb 24, 2013 (gmt 0) |
Consider giving subcategory selects different names, having multiple selects with same name likely to cause problems. If same name is a must, add/remove options from single select based on category.
Place subcategory selects within div with id="subcats" in category value order, each select with style="display:none"
function changeSelect( selectNo ) {
var sels = document.getElementById("subcats").getElementsByTagName('SELECT');
for( var j=0; j<sels.length; j++ ) {
sels[j].style.display = none;
if ( j===(selectNo-1) { sels[j].style.display = ''; }
}
}
<select name="category" onchange="changeSelect( this.value )" >
|
harpreet9629
msg:4548385 | 5:57 pm on Feb 24, 2013 (gmt 0) |
can you give me code with live example i cant understand
|
Gowri pandiyan
msg:4551255 | 6:10 am on Mar 5, 2013 (gmt 0) |
Below is the clean code for the same. Kindly, check the below code.
<HTML>
<HEAD>
<script>
function changeSelect( selectNo )
{
var sels = document.getElementById("subcats").getElementsByTagName('SELECT');
for( var j=0; j<sels.length; j++ )
{
sels[j].style.display = "none";
if ( j===(selectNo-1) )
{ sels[j].style.display = ''; }
}
}
</script>
</HEAD>
<BODY>
<select name="category" onchange="changeSelect( this.value )">
<option value="0">Select Category</option>
<option value="1">ABC</option>
<option value="2">123</option>
<option value="3">abc</option>
</select>
<div id="subcats">
<select name="subcategory" style="display:none">
<option value="0">Select Sub-Category</option>
<option value="1">A</option>
<option value="2">B</option>
<option value="3">C</option>
</select>
<select name="subcategory" style="display:none">
<option value="0">Select Sub-Category</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select name="subcategory" style="display:none">
<option value="0">Select Sub-Category</option>
<option value="1">a</option>
<option value="2">b</option>
<option value="3">c</option>
</select>
</div>
</BODY>
</HTML>
|
|
