...

View Full Version : Resolved newbie question --- wholesale row color change



iaw4
01-15-2012, 01:23 AM
Easier to show than to explain:




<head>

<SCRIPT LANGUAGE="JavaScript">
function checkAll(field) { for (i = 0; i < field.length; i++) field[i].checked = true ; }
function uncheckAll(field) { for (i = 0; i < field.length; i++) field[i].checked = false ; }
</script>

</head>

<body>

<form name="myform">

<table>
<tr id="CA" name="list" value="1" style="background-color:yellow;"> <td> <input type="checkbox" name="list" value="1" onclick="document.getElementById('CA').style.backgroundColor=this.checked?'white':'cyan';">Choice CA</td> </tr>
<tr id="CB" name="list" value="1" style="background-color:yellow;"> <td> <input type="checkbox" name="list" value="1" onclick="document.getElementById('CB').style.backgroundColor=this.checked?'white':'cyan';">Choice CB</td> </tr>
<tr id="CC" name="list" value="1" style="background-color:yellow;"> <td> <input type="checkbox" name="list" value="1" onclick="document.getElementById('CC').style.backgroundColor=this.checked?'white':'cyan';">Choice CB</td> </tr>
</table>

<input type="button" name="CheckAll" value="Check All" onClick="checkAll(document.myform.list)">
<input type="button" name="UnCheckAll" value="Uncheck All" onClick="uncheckAll(document.myform.list)">

</form>

<p>All never touched should be yellow. All checked should have white background. All unchecked should have cyan background.</p>

<p>How do I get 'Check All' and 'Uncheck All' to obey the tr background color, too?</p>

xelawho
01-15-2012, 02:14 AM
like this?



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

<script>
function checkAll(field) {
for (i = 0; i < field.length; i++) {
field[i].checked = true ;
changeBG(field[i])
}
}

function uncheckAll(field) {
for (i = 0; i < field.length; i++) {
field[i].checked = false ;
changeBG(field[i])
}
}

function changeBG(box) {
if(box.checked==true){
box.parentNode.style.backgroundColor="#FFFFFF"
} else {
box.parentNode.style.backgroundColor="#00FFFF"
}
}
</script>

</head>

<body>

<form name="myform">

<table>
<tr id="CA" name="list" value="1" style="background-color:yellow;"> <td> <input type="checkbox" name="list" value="1" onclick="changeBG(this)">Choice CA</td> </tr>
<tr id="CB" name="list" value="1" style="background-color:yellow;"> <td> <input type="checkbox" name="list" value="1" onclick="changeBG(this)">Choice CB</td> </tr>
<tr id="CC" name="list" value="1" style="background-color:yellow;"> <td> <input type="checkbox" name="list" value="1" onclick="changeBG(this)">Choice CB</td> </tr>
</table>

<input type="button" name="CheckAll" value="Check All" onClick="checkAll(document.myform.list)">
<input type="button" name="UnCheckAll" value="Uncheck All" onClick="uncheckAll(document.myform.list)">

</form>

<p>All never touched should be yellow. All checked should have white background. All unchecked should have cyan background.</p>

<p>How do I get 'Check All' and 'Uncheck All' to obey the tr background color, too?</p>
</body>
</html>

iaw4
01-15-2012, 04:17 AM
thanks. this was perfect.

best,

/iaw4



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum