.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
Sign In
Win Surprise Gifts!!!

Top 5 Contributors of the Month
Gaurav Pal

Home >> Articles >> ASP.NET >> Post New Resource Bookmark and Share   

 Subscribe to Articles

Highlight GridView Row On MouseOver Using Javascript and CSS.

Posted By:Manoranjan Sahoo       Posted Date: October 01, 2010    Points: 15    Category: ASP.NET    URL: http://www.dotnetspark.com  

Highlight GridView Row On MouseOver Using Javascript and CSS.

Hello Friend,

Sometimes we need to give attractive look to a GridView by highlighting rows.

Now the query is how to make row hightlight?

Here i am giving a simple solution to make it workable. I am using the mousehover event and some javascript to make it workable.

First define two css class as below :

<style type="text/css">

Now we have to put the below code in row databound method of the gridview.

void GridView1_RowDataBound(Object sender, GridViewRowEventArgs e)
    if(e.Row.RowType == DataControlRowType.DataRow)
      e.Row.Attributes.Add("onmouseover", "this.className='highlightrow'");
      e.Row.Attributes.Add("onmouseout", "this.className='normalrow'");

Now you will get the highlighted row when mouse over.

Just run the application and check the output.

 Subscribe to Articles


Further Readings:


No response found. Be the first to respond this post

Post Comment

You must Sign In To post reply
Find More Articles on C#, ASP.Net, Vb.Net, SQL Server and more Here

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend