Question

I have two drop down lists , list1, list 2. I want it to change according to the radio button selected by the user.

If the user selects radio button1, lists1 should be displayed.
If the user selects radio button2, lists2 should be displayed.

How can i achieve this using javascript.
Please somebody help me.

Answer 1

Here my sample, you should modify it as yours:

<div>
    <input type="radio" name="rdo" id="rdo1" value="list1" />Radio1
    <select id="select1" style='display:none;'>
        <option value="l1">list1-1</option>
        <option value="l2">list1-2</option>
    </select>
</div>
<div>
    <input type="radio" name="rdo" id="rdo2" checked="checked" value="list2"/>Radio2
    <select id="select2">
        <option value="l1">list2-1</option>
        <option value="l2">list2-2</option>
    </select>
</div>

<script>
function select1() {
    document.getElementById("select1").style.display="block";
    document.getElementById("select2").style.display="none";   
}

function select2() {
 document.getElementById("select2").style.display="block";
document.getElementById("select1").style.display="none";             
}    


document.getElementById("rdo1").onclick = select1;
document.getElementById("rdo2").onclick = select2;
</script>

on jsfiddle: http://jsfiddle.net/u8Tvq/