Select a radio by only clicking in text??????

ale77 · Jan 7, 2004

Hi. I have a question. I know that in javascript a lot of things are possible, but I can't find a way to do this.

I have a simple form with radio buttons. My question is if there is a way that I can select the radio button by only clicking on the text. Example, selecting the radio option one by clicking with the mouse on the text "Option #1"?????????????

<table border="0" cellpadding="5" cellspacing="0" width="105" >
<tr class="radio_button">
<td valign="top"><span><b>Options:</b></span>
<span><input type="radio" name="options" value="ONE" ID="Radio1" checked >Option #1
<br><input type="radio" name="options" value="TWO" ID="Radio2" checked >Option #2
<br><input type="radio" name="options" value="THREE" ID="Radio3" checked >Option #3
</td></tr></table>

Lrnmore · Jan 7, 2004

ale77,

Tested this in IE6 and NN7, set up a span and give it an
onClick event.

Code:

<!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 4.0 Transitional//EN&quot;>
<html><head><title>TEST</title>
<script language=&quot;JavaScript&quot;>
function ckrad(id){
id = parseInt(id);
d = document.forms[0];
d.grp1[id].checked = true;
}
</script></head><body><form>
<span id=&quot;0&quot; onClick=&quot;ckrad(this.id)&quot;>
<input type=&quot;radio&quot; name=&quot;grp1&quot;>Option1</span><br>
<span id=&quot;1&quot; onClick=&quot;ckrad(this.id)&quot;><input type=&quot;radio&quot; name=&quot;grp1&quot;>Option2</span><br>
<span id=&quot;2&quot; onClick=&quot;ckrad(this.id)&quot;><input type=&quot;radio&quot; name=&quot;grp1&quot;>Option3</span></form>
</body></html>

Great Javascript Resource:

http://devedge.netscape.com/library/manuals/2000/javascript/1.5/guide/

ale77 · Jan 7, 2004

Thanks, it's working fine!!!!!!!!

BillyRayPreachersSon · Jan 7, 2004

There is an easier way...

As far as I know, the LABEL tag is still in the W3C specs. It certainly works in IE 6, NN 7, Opera 7, and Mozilla 1.5.

You simply have a LABEL tag with the label text inside it, with a FOR attribute containing the ID of the associated input element.

Here's the code:

Code:

<HTML>
<HEAD>
</HEAD>
<BODY>

<FORM>
	Do you like Tek-Tips?
	<BR>

	<INPUT ID=&quot;yesno_yes&quot; TYPE=&quot;radio&quot; NAME=&quot;yesno&quot; VALUE=&quot;yes&quot; CHECKED>
	<LABEL FOR=&quot;yesno_yes&quot;>Yes</LABEL>

	<BR>

	<INPUT ID=&quot;yesno_no&quot; TYPE=&quot;radio&quot; NAME=&quot;yesno&quot; VALUE=&quot;no&quot;>
	<LABEL FOR=&quot;yesno_no&quot;>No</LABEL>
	
		
	
</FORM>

</BODY>
</HTML>

Hope this helps!

Dan

ale77 · Jan 8, 2004

Thanks, it works really good and it's more simple.

BillyRayPreachersSon · Jan 8, 2004

Thanks!

I had this feeling there was a way to do it, I just didn't know it, so flicked through the trust O'Reilly DHTML book, and read up on it ;o)

Dan

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Select a radio by only clicking in text??????

ale77

Programmer

Lrnmore

Technical User

ale77

Programmer

BillyRayPreachersSon

Programmer

ale77

Programmer

BillyRayPreachersSon

Programmer

Similar threads

Part and Inventory Search

Sponsor