select set the dropdown list according to user selection(radio button)

Question

I have two dropdownlists, namely A and B.

I need to set the dropdownlist A and B with two different values, according to selected radio button selected by the user.

There are two radio buttons namely R1 and R2:

• If user selects R1 then dropdownlist A should select 00:00 and B should select 08:00 .
• If user selects R2 then dropdownlist A should select 00:00 and B should select 04:00 ;

Both dropdown lists, A and B contain 00:00, 00:01... up to 23:59.

How can I achieve this? Please any one help me.

Answer 1

You could use javascript to change the values accordingly. Set the value of selected=true in the option tag in the select type according to the user input using js.

Answer 2

<script language="javascript" type="text/javascript">
function func(obj){
if(obj.value=="r1"){
   var bnd = document.getElementById("sel1")
      bnd.options[1].selected=1;
   var bnd1 = document.getElementById("sel2")
      bnd1.options[2].selected=1;
}
if(obj.value=="r2"){
   var bnd = document.getElementById("sel1")
      bnd.options[0].selected=1;
   var bnd1 = document.getElementById("sel2")
      bnd1.options[1].selected=1;
 }
}
</script>

<INPUT type="radio" id="val" name="r" value="r1" onclick="func(this)"> R1<BR>
<INPUT type="radio" id="val1" name="r" value="r2" onclick="func(this)"> R2<BR>
<SELECT name="sel1" id="sel1">
   <OPTION value="opt11">Opt11</OPTION>
   <OPTION value="opt12">opt12</OPTION>
   <OPTION value="opt13">Opt13</OPTION>
</SELECT>
<SELECT name="sel2" id="sel2">
   <OPTION value="opt21">opt21</OPTION>
   <OPTION value="opt22">opt22</OPTION>
   <OPTION value="opt23">opt23</OPTION>
</SELECT>

Sorry for posting as a separate answer. Couldn't post this code in the comment.