Hightlight a row in a table when....

Jay

Hi !

I am writing a page that displays a list of records in a table. Each
row for each record. Each row has a checkbox associated with it. Does
anybody know how to highlight a row when I click on a checkbox in that
row and unhightlight it when I re-click that checkbox? (like in
"hotmail" and "yahoo" e-mail when u select a message to delete).
Any help would be appreciated !

Thank you in advance !

Jay

Jul 23 '05 #1

Subscribe Post Reply

1617

mscir

Jay wrote:

Hi !
I am writing a page that displays a list of records in a table. Each
row for each record. Each row has a checkbox associated with it. Does
anybody know how to highlight a row when I click on a checkbox in that
row and unhightlight it when I re-click that checkbox? (like in
"hotmail" and "yahoo" e-mail when u select a message to delete).

Any help would be appreciated !
Thank you in advance !
Jay

this works in IE6, Netscape 7.1, Firefox 0.8:

<script type="text/javascript">
var color1="#D2E9FF";
var color2="#99CCFF";
function changebkg(ckbox,rownum) {
if (ckbox.checked)
document.getElementById('row'+rownum).style.backgr ound=color1;
else
document.getElementById('row'+rownum).style.backgr ound=color2;
}
</script>

<table width=110 bgcolor="99CCFF" border=1>
<tr id="row0" name="row0">
<td width="10"><input type="checkbox" name="C1" value="ON"
onclick="changebkg(this,0)"> </td>
<td width="50"> </td>
<td width="50"> </td>
</tr>
<tr>
<tr id="row1" name="row1">
<td width="10"><input type="checkbox" name="C1" value="ON"
onclick="changebkg(this,1)"> </td>
<td width="50"> </td>
<td width="50"> </td>
</tr>
</table>

Mike

Jul 23 '05 #2

Jay

Thank a lot Mike, It worked !!!!! Jayyyyyy

Jay

Jul 23 '05 #3

Martin Honnen

Jay wrote:

I am writing a page that displays a list of records in a table. Each
row for each record. Each row has a checkbox associated with it. Does
anybody know how to highlight a row when I click on a checkbox in that
row and unhightlight it when I re-click that checkbox? (like in
"hotmail" and "yahoo" e-mail when u select a message to delete).

Here is an example that traverses the document tree for a <tr> ancestor
element and then changes its inline background-color style as needed

<html lang="en">
<head>
<title>changing the background-color of a table row</title>
<script type="text/javascript">
var backgroundColor = 'lightblue';
function setRowBackground (childCheckbox) {
var row = childCheckbox.parentNode;
while (row && row.tagName.toLowerCase() != 'tr') {
row = row.parentNode;
}
if (row && row.style) {
if (childCheckbox.checked) {
row.style.backgroundColor = backgroundColor;
}
else {
row.style.backgroundColor = '';
}
}
}
</script>
<style type="text/css">
tr {
background-color: lightgreen;
}
</style>
</head>
<body>
<table>
<tbody>
<tr>
<td>
<label>
delete
<input type="checkbox" name="message" value="1"
onclick="setRowBackground(this);">
</label>
<td>
All for Kibology
</td>
</tr>

<tr>
<td>
<label>
delete
<input type="checkbox" name="message" value="2"
onclick="setRowBackground(this);">
</label>
<td>
Kibology for all
</td>
</tr>
</tbody>
</table>
</body>
</html>

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #4

Similar topics

How to do a <table> with <div> tag

by: Toby Austin | last post by:

I'm trying to replace <table>s with <div>s as much as possible. However, I can't figure out how to do the following… <table> <tr> <td valign="top" width="100%">some data that will...

HTML / CSS

How to put/edit VB script what hightlight buttons on mousemove?

by: AA Arens | last post by:

When you open the Access contacts database, you will see that when you move with your mouse over the buttons, the text become bold. This is the VB script: ***************************** ...

Microsoft Access / VBA

hightlight

by: Frank | last post by:

Hi, the text in my textbox is highlighted when I tab to it. I can't find the DESIGN property to prohibit this. Please help me out Thanks Frank

Visual Basic .NET

Update to child table fails

by: PAUL | last post by:

Hello, I have 2 tables with a relationship set up in the dataset with vb ..net. I add a new record to the parent table then edit an existing child record to have the new parent ID. However when I...

Visual Basic .NET

Use Select Query variable against a table and return value to same select query

by: jjturon | last post by:

Can anyone help me?? I am trying to pass a Select Query variable to a table using Dlookup and return the value to same select query but to another field. Ex. SalesManID ...

Microsoft Access / VBA

How to ALTER a table using the ALTOBJ procedure

by: Serge Rielau | last post by:

Hi all, Following Ian's passionate postings on problems with ALTOBJ and the alter table wizard in the control center I'll try to explain how to use ALTOBJ with this thread. I'm not going to get...

DB2 Database

How to hightlight a particular text in text widget

by: manimuthu | last post by:

Hai, I am newbie in perl. I had tried to search a particular text and hightlight the text. I had using perl tk for text widgets. Anyone can helpme how to highlight text for using text widget....

Perl

How to make the datagrid view not hightlight the first row?

by: bill | last post by:

When you retrieve records to diplay in a DataGridView control the first record has the background highlighted even though no row is yet selected. Does anyone know a way to suppress this first...

.NET Framework

How to hightlight a selected row in a datagrid

by: altaafhussein | last post by:

Hi, i have checked all over the internet, but they just hightlight rows using the datagrid attributes. How do you hightlight a selected row in a datagrid. I tried the onclick attribute but that does...

Visual Basic .NET

Cloud Servers without Credit Card and Email Registration: A Simpler Way to Get on the Cloud

by: CloudSolutions | last post by:

Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...

General

Wordpress or something else?

by: Faith0G | last post by:

I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

Content Management Systems

Access Europe: Command bars, the Access Shortcut Tool and a simple Audit Log - Wed 3 April

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

General

One-click Importing Excel Data into a*Database

by: ryjfgjl | last post by:

In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...

Microsoft Excel

Easy Steps to Fix "Canon Printer Won't Connect to WiFi Network"

by: taylorcarr | last post by:

A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...

General

Batch import of multiple excel files into the database

by: ryjfgjl | last post by:

If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...

Data Management

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math