View Full Version : Change row color when radio button is checked

10-27-2006, 09:33 PM
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. :)

10-27-2006, 10:02 PM
Not the nicest code, but to give you and idea...

<!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">
<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; }
<script type="text/javascript">
function rowHighlight(obj) {
if (obj.checked) {
obj.parentNode.parentNode.className = 'highlight';
} else {
obj.parentNode.parentNode.className = '';
<table id="myTable">
<tr id="r1">
<td><input type="checkbox" onChange="rowHighlight(this);" /></td>
<td><p>This is my Row 1</p></td>
<tr id="r2">
<td><input type="checkbox" onChange="rowHighlight(this);" /></td>
<td><p>This is my Row 2</p></td>