Sunday 30 December 2007

Clickable row in ASP .NET Table II: Adding some functionality

In last blog you have learnt how to make Table row click able. Unfortunately it hardly does anything. This time we will add some functionality to it. This time on click of we are going to change the background color of the row.

First we are going to modify the JavaScript function to take some parameter.

< script type="text/javascript">
function ToggleColor( selectedRow )
{
if( tableRow.style.backgroundColor == 'red';)
tableRow.style.backgroundColor = 'blue';
else
tableRow.style.backgroundColor = '#red';
}
< / script>

ToggleColor takes a TableRow HTML DOM object as argument. It then checks if the background color of the row is red, if so set it to blue otherwise red.
This will toggle row color to red and blue if you keep clicking the row.


Now wee need to change the Table and javascript method association to call new method with argument.


row.Attributes.Add("onClick", "javascript:ToggleColor(this);");

You must have noticed the difference. Yea we are passing 'this' object. Which refers to the invoking row. And that's does all the tricks.


Keep clicking :)

No comments:

Post a Comment