Display div's based upon selection of radio Buttons.

[Gopi Chand Maddula]

Hi,

I am a newbie in Javascript. I have a requirement of displaying different div's based upon which radio button is selected.

I should forward messages in two ways. either by sms or by mail.
So i have two div's one for sms, another for email and respective radio buttons as well.

if i select sms then i should display div related to sms and if email i should hide the sms div and display the email div.

here is my code

<input type="radio" checked="checked" id="messageOptions" name="messageOptions" value="0" onclick="showHidden()"/>Send By SMS
<input type="radio" checked="checked" id="messageOptions" name="messageOptions" value="1" onclick="showHidden()"/>Send By Email

and my java script is

function showHidden()
{
	var value=document.getElementById("messageOptions").value;
		if(value == 0){
			document.getElementById("msgbySMS").style.display = '';
			document.getElementById("msgbyEmail").style.display = 'none';
		}else if(value == 1){
			document.getElementById("msgbySMS").style.display = "none";
			document.getElementById("msgbyEmail").style.display = '';
		}
	
}

Am i following the right procedure? But it is not working in my browser, but i am not using any IDE.
I think my code have some syntax errors as well, i am unable to debug whats the problem.

Please suggest me to correct my code.

Thanks in Advance,

[Eric Pascarello]

ids are singular. You can only have one element with the same id. Give each one their own id [name can stay the same]

You should than used checked.

var isSMS = document.getElementById("smsRadioId").checked; 

Eric