Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Oct 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Change row color when radio button is checked

    I am new to javascript so I apologize for my ignorance.

    I have a table where a user will select a model. Each row represents a different model. There are four columns. Col1 contains the radio button.

    I would like to be able to change the bgcolor of the TR to #FFFFCC when its radio button is checked and have it revert to #FFFFFF when not checked.

    Can anyone help? Thanks in advance for your help.

  • #2
    Regular Coder
    Join Date
    Dec 2002
    Location
    Minneapolis, MN
    Posts
    208
    Thanks
    0
    Thanked 1 Time in 1 Post
    Not the nicest code, but to give you and idea...
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    	<title>Testing</title>
    	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    	<meta http-equiv="Content-Language" content="en-us" />
    	<style type="text/css">
    		.highlight { background-color: yellow; }
    	</style>
    	<script type="text/javascript">
    		function rowHighlight(obj) {
    			if (obj.checked) {
    				obj.parentNode.parentNode.className = 'highlight';
    			} else {
    				obj.parentNode.parentNode.className = '';
    			}
    		}
    	</script>
    </head>
    <body>
    	<table id="myTable">
    		<tr id="r1">
    			<td><input type="checkbox" onChange="rowHighlight(this);" /></td>
    			<td><p>This is my Row 1</p></td>
    		</tr>
    		<tr id="r2">
    			<td><input type="checkbox" onChange="rowHighlight(this);" /></td>
    			<td><p>This is my Row 2</p></td>
    		</tr>
    	</body>
    </html>
    anthony


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •