We help IT Professionals succeed at work.

Flashing table row background

Richard Korts
Richard Korts used Ask the Experts™
on
Hi,

I am trying to make the background of a table row "flash", to highlight it's addition to a database table.

It works (sort of) in Firefox, not in IE. This is a controlled environment & the customer is using IE.

The attached code shows the Javascript I'm using & the table row definition.

It's too difficult to construct an actual working example without revealing customer proprietary data.

Can I make it work in IE?

Thanks
blinking.htm
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Hello,

I checked out the script but, the sample code is too incomplete to specifically script you a solution without writing a new script which may not help.

However, I was able to see enough it to observe that the likely reason is that your updating the property of the row, not the columns within the row and that causes issues with ie.

You will need to loop through all the columns in the row and update them instead of just changing the value in row tag.

Here is a resource to help you script the solution. Looping through the Columns in a table row

Once you change your script to update the column property, it  should begin working in ie.

Also, I am curious... why didn't you just use the CSS property "background-color" rather then the bgcolor attribute in html?
Richard KortsBusiness Owner / Chief Developer

Author

Commented:
To TechHelpr08210

Can every column have the same ID or does every one have to have a DIFFERENT ID?

If makes it very messy if all need be different; there are maybe 20 different columns.

Thanks
You only should need to specify the row id initially. Then, you will loop through all of columns in the selected row and update the bgcolor property in each column as you were already doing.

Below, I modified your original script and included a loop:

function blinkIt() {
	var row = document.getElementById("bl1");
		for (var i = 0, cell; cell = row.cells[i]; i++) { 
			//iterate through cells 
			cell.bgColor ='#FFFFFF';
			//cells would be accessed using the "cell" variable assigned in the for loop 
		}
		setInterval("Timer()", 500);
		x=1;
	}

function Timer() {
	set=1;
	var row = document.getElementById("bl1");
	if(x==0 && set==1) {
		for (var i = 0, cell; cell = row.cells[i]; i++) { 
			//iterate through cells 
			cell.bgColor ='#E9C3E9';
			//cells would be accessed using the "cell" variable assigned in the for loop 
		} 
		x=1;
		set=0;
	}
	if(x==1 && set==1) {
		for (var i = 0, cell; cell = row.cells[i]; i++) { 
			 //iterate through cells 
			cell.bgColor ='#FFFFFF';
			//cells would be accessed using the "cell" variable assigned in the for loop 
		} 
		x=0;
		set=0;
	}
}
		
function load() {
	document.getElementById('container').scrollTop=3570;
	blinkIt();
}

Open in new window

Systems Development / Support Specialist
Commented:
Richard KortsBusiness Owner / Chief Developer

Author

Commented:
To anuradhay,

That looks perfect, I'll try it & see.

Thanks,

rkorts
Richard KortsBusiness Owner / Chief Developer

Author

Commented:
To anuradhay,

I actually need to do it with two different colors, depending upon the row.

This is (of course) not fixed html; it's generated by php so I can (and do) make the <tr class different depending upon the circumstances.

Can you see a way to generalize that solution so it works with two different colors on different rows?

Thanks