click label to select radio button

Hi All
i want to develop a code such that when i click on the text next to the radio button the radio button should be selected and even if the button is clicked
how can i achieve this
any help would b appriciated
thanks in advance

<html> <head> <script language="Javascript"> </script> </head> <body> <table> <tr> <td width="4%" valign="top" align="left"><font face="Times New Roman" size="3" color="#000000">1.</font></td> <td width="30%" valign="top" align="left" nowrap><font face="Times New Roman" size="3" color="#000000">Select an option</font></td> <td width="73%" valign="top" align="left"> <input type="radio" name="grp" value="Yes" tabindex="1">Yes <input type="radio" name="grp" value="No" tabindex="1">No</td> </tr> </table> </body> </html>

farahphp

Newbie Poster

14 posts since Mar 2008

Reputation Points: 10

Solved Threads: 0

4 Years Ago

0

Code bellow should help you, good luck!

<html>
	<head>
		<script language="Javascript">

     </script>
<script>
function selectrd(id)
{
	var opt=(id==1)?"yes":"no";
	var tg=document.getElementById("rd" + opt);
	tg.checked=true;
}
</script>
</head>
<body>
<table>
<tr>
      		<td width="4%" valign="top" align="left"><font face="Times New Roman" size="3"
          color="#000000">1.</font></td>
      		<td width="30%" valign="top" align="left" nowrap><font face="Times New Roman" size="3"
          color="#000000">Select an option</font></td>
      		<td width="73%" valign="top" align="left">
	 			<input id="rdyes" type="radio" name="grp" value="Yes" tabindex="1">Yes
	  			<input id="rdno" type="radio" name="grp" value="No" tabindex="1">No</td>
    		</tr>
</table>
<label onclick="selectrd(1)">Select Yes</label> | 
<label onclick="selectrd(2)">Select No</label> 

</body>
</html>

o0DarkEvil0o

Newbie Poster

3 posts since May 2008

Reputation Points: 10

Solved Threads: 1

4 Years Ago

0

> i want to develop a code such that when i click on the text next to the radio button the radio
> button should be selected and even if the button is clicked
You don't need Javascript for this; use the HTML label tag.

<p>Try clicking on the text labels:</p>
<form name="input" action="">
<input type="radio" name="sex" id="male" />
<label for="male">Male</label>

<input type="radio" name="sex" id="female" />
<label for="female">Female</label>
</form>

~s.o.s~

Failure as a human

Administrator

11,938 posts since Jun 2006

Reputation Points: 3,281

Solved Threads: 734

3 Years Ago

0

There is a potential problem relying on the html label solution above: I am trying to set up a list of buttons using javascript to highlight the selected option.

<span onClick = "jfsw(2,la,10);">
<input type="radio" name="cruts21t" id="19111920" value="19111920" />
<label class="radio" id="cruts21tb" for="19111920">1911-1920</label>
</span>

In the above, the javascript function jfsw highlights the label when the input or label is clicked on. The problem is that firefox 2.0.0.13 leaves a small space between the input symbol and the label. Clicking on this space activates the javascript but does not select the corresponding radio button. Internet Explorer appears not to have this problem.

Can the format of the label be made to change when the button is checked without using javascript?

mnjbadc

Newbie Poster

3 posts since Aug 2008

Reputation Points: 10

Solved Threads: 1

3 Years Ago

0

This is how I would do it

<p>Try clicking on the text labels:</p>
<form name="input" action="">
<input type="radio" name="sex" id="male" />
<label for="male">Male</label>

<input type="radio" name="sex" id="female" />
<label for="female">Female</label>
</form>

langsor

Posting Whiz

390 posts since Aug 2008

Reputation Points: 30

Solved Threads: 36

3 Years Ago

0

1911-1920

In the above, the javascript function jfsw highlights the label when the input or label is clicked on. The problem is that firefox 2.0.0.13 leaves a small space between the input symbol and the label. Clicking on this space activates the javascript but does not select the corresponding radio button. Internet Explorer appears not to have this problem.

Can the format of the label be made to change when the button is checked without using javascript?

<span onClick = "jfsw(2,la,10);">
<input type="radio" name="cruts21t" id="19111920" value="19111920" /><label class="radio" id="cruts21tb" for="19111920">1911-1920</label>
</span>

Try that ... the newline is interpreted as a space-character between theradio and the label

...

langsor

Posting Whiz

390 posts since Aug 2008

Reputation Points: 30

Solved Threads: 36

3 Years Ago

0

Thanks Langsor, that reduces the gap, but does not eliminate it. With Firefox rendering, there is also a small area beneath the input button, but inside the enclosing span, which does not change the selection.

mnjbadc

Newbie Poster

3 posts since Aug 2008

Reputation Points: 10

Solved Threads: 1

3 Years Ago

0

use this only a little change

add lable

Yes

nikesh.yadav

Posting Whiz in Training

219 posts since Feb 2008