Question : Simple JavaScript Hide/Show DIV Question

I have 3 radio buttons.. When a radio button is selected, I want to show the correct DIV. If the choice "None" is selected, I want to hide the divs....


Basically it is not really working.


1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
<script language="Javascript1.2">
	function showOptions(){

		var radioLength = document.populateTable.rdo_choice.length;
		var checkedOption = '';

		for(var i = 0; i < radioLength; i++) {
			if(document.populateTable.rdo_choice[i].checked) {
				checkedOption = document.populateTable.rdo_choice[i].value;
			}
		}

		if (checkedOption == "sales")
			document.getElementById('sales_div').style.display='block';
		else if (checkedOption == "clients")
			document.getElementById('clients_div').style.display='block';
		else
			document.getElementById('sales_div').style.display='none';
			document.getElementById('clients_div').style.display='none';
	}
</script>




<input type="radio" name="rdo_choice" value="None" style="border: none;" onClick="return showOptions()"> None &nbsp;&nbsp;|&nbsp;&nbsp;
<input type="radio" name="rdo_choice" value="clients" style="border: none;" onClick="return showOptions()"> Report Details By Client &nbsp;&nbsp;|&nbsp;&nbsp;
<input type="radio" name="rdo_choice" value="sales" style="border: none;" onClick="return showOptions()"> Report Details Salesperson &nbsp;&nbsp;|&nbsp;&nbsp;


<div id="clients_div" style="display:none">

Data Here...

</div>

<div id="sales_div" style="display:none">

Data here...

</div>

Answer : Simple JavaScript Hide/Show DIV Question

How about like this:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
function showOptions(){
		
		if (document.populateTable.rdo_choice[0].checked) {
			document.getElementById('sales_div').style.display='block';
		}
		else if (document.populateTable.rdo_choice[1].checked) {
			document.getElementById('clients_div').style.display='block';
		}
		else {
			document.getElementById('sales_div').style.display='none';
			document.getElementById('clients_div').style.display='none';
		}
	}
Random Solutions  
 
programming4us programming4us