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!

Register Log in
  • Congratulations derfloh 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

PushCode

Programmer
Joined
Dec 17, 2003
Messages
573
Location
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>
 
Sort by date Sort by votes
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]
 
Upvote 0 Downvote
Thanks cLFlaVA! That's what I needed.
 
Upvote 0 Downvote
any time :)

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

Similar threads

TheLazyPig
  • Locked
  • Question Question
Buttons not aligned after another button is clicked
Replies
2
Views
672
gmmastros
gmmastros
Mike Lewis
  • Locked
  • Question Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid)
Replies
5
Views
2K
Mike Lewis
Mike Lewis
Rayj0000
  • Locked
  • Question Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
861
Rayj0000
Rayj0000
malpa
  • Locked
  • Question Question
Graph the selection of a html table row
Replies
0
Views
1K
malpa
malpa
berkshirea
  • Locked
  • Question Question
Radio Button Clicked, Another Radio Becomes Mandatory
Replies
2
Views
860
berkshirea
berkshirea

Part and Inventory Search

Sponsor

Back
Top