Wednesday, March 20, 2013

Change Row Color on Mouse Over and Highlight gridview rows on mouseover using JavaScript in C# Asp .Net

==>> Create a table in SQL Employee and create a website in add new page  and paste the Code:--

1.  ASPX PAGE CODE:-

 <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Asp .Net Gridview row color change on Mouse Over </title>
<script type="text/javascript">
var originalgridcolor;
function FnColorChangeMouseOver(element) {
originalgridcolor = element.style.backgroundColor;
element.style.backgroundColor = '#94a8ff';
element.style.cursor = 'pointer';
element.style.textDecoration = 'underline';
}
function FnColorChangeMouseOut(element) {
element.style.backgroundColor = originalgridcolor;
element.style.textDecoration = 'none';

}
</script>
</head>
<body>
<form id="FrmMouseOver" runat="server">
<div>
<asp:GridView runat="server" ID="EmpTestGrid"  AutoGenerateColumns="false"
HeaderStyle-BackColor="#EB94FF" HeaderStyle-ForeColor="White"
onrowdatabound="EmpTestGrid_RowDataBound">

<Columns>
<asp:BoundField DataField="EmpName" HeaderText="Name" />
<asp:BoundField DataField="FName" HeaderText="Father Name" />
<asp:BoundField DataField="EmpEmail" HeaderText="Email" />
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>



2. ASPX.CS PAGE CODE:-  


using System;
using System.Data;
using System.Data.SqlClient;




protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
BindGrid();
}
}
protected void EmpTestGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
if(e.Row.RowType== DataControlRowType.DataRow)
{
e.Row.Attributes["onmouseover"] = "javascript:FnColorChangeMouseOver(this)";
e.Row.Attributes["onmouseout"] = "javascript:FnColorChangeMouseOut(this)";
}
}
protected void BindGrid()
{
SqlConnection con =
new SqlConnection("Data Source=Subhash;Integrated Security=true;Initial Catalog=EmployeeTest");
con.Open();
SqlCommand sqlcmd = new SqlCommand("select * from Employee", con);
sqlcmd.ExecuteNonQuery();
SqlDataAdapter sqlda = new SqlDataAdapter(sqlcmd);
DataSet ds = new DataSet();
sqlda.Fill(ds);
EmpTestGrid.DataSource = ds;
EmpTestGrid.DataBind();
con.Close();
}


Hope this help you 

No comments:

Post a Comment