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!

  • Congratulations John Tel on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

how to select a radio button with onClick event of an image 1

Status
Not open for further replies.

PushCode

Programmer
Dec 17, 2003
573
US
In addition to clicking on the radio item itself, I'd like to allow users to select a radio item by clicking on the image that is associated with that radio item.

Shouldn't it be something like this? Thanks for any help.

Code:
<script>
	function doSelect(rval)
		{
		if(document.frmtheme.theme.value=rval;)
			{document.frmtheme.theme.checked;}
		}
</script>
<table width="100%" border="0" cellspacing="0" cellpadding="4" bgcolor="white">
	<tr>
		<td width="27"><input type="radio" name="theme" value="0"<cfif NOT isDefined('page.theme_id')> checked</cfif>></td>
		<td width="99">Default</td>
		<td width="274"><img src="../../../../insurance/pics/themes/theme_#prod_code#_default.gif" width="200" height="150" onClick="doSelect(0);"></td>
	</tr>
	<tr>
		<td colspan="3">&nbsp;</td>
	</tr>
	<tr>
		<td width="27"><input type="radio" name="theme" value="2"<cfif isDefined('page.theme_id') AND page.theme_id IS '2'> checked</cfif>></td>
		<td width="99">Blue</td>
		<td width="274"><img src="../../../../insurance/pics/themes/theme<cfif prod_code is 'pose'>_#prod_code#</cfif>_blue.gif" width="200" height="150" onClick="doSelect(2);"></td>
	</tr>
	<tr>
		<td colspan="3">&nbsp;</td>
	</tr>
	<tr>
		<td><input type="radio" name="theme" value="3"<cfif isDefined('page.theme_id') AND page.theme_id IS '3'> checked</cfif>></td>
		<td>Brick</td>
		<td><img src="../../../../insurance/pics/themes/theme<cfif prod_code is 'pose'>_#prod_code#</cfif>_brick.gif" width="200" height="141" onClick="doSelect(3);"></td>
	</tr>
</table>
 
Example:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/strict.dtd">[/URL]

<html>
<head>
<title>new document</title>

</head>

<body>

<form name="f">
    <input type="radio" name="pic" value="pic1" />
    <img src="[URL unfurl="true"]http://www.tek-tips.com/images/logo.gif"[/URL] onclick="document.f.pic[0].checked = true;" />
    <input type="radio" name="pic" value="pic2" />
    <img src="[URL unfurl="true"]http://www.ibm.com/i/v14/t/ibm-logo.gif"[/URL] onclick="document.f.pic[1].checked = true;" />
</form>

</body>

</html>

*cLFlaVA
----------------------------
[tt]insert funny quotation here.[/tt]
 
any time :)

*cLFlaVA
----------------------------
[tt]insert funny quotation here.[/tt]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top