Recently, One of My Friend asked me that how can we add Mouse Hover Effect on Grid View. So I want to share it with you too.
Firstly, This is the Sql Table Structure:
Create a New Website by clicking File->New Website.
Then,
Add a connection String to the Web.config file
Then, Add a GridView to the .aspx page
Now Add a style tag in the head tag of the .aspx page. Here is the .aspx page.
Now, In the Code Behind file
Add a class level variable to store Connection String and in the pageload event retrieve the connection string that we stored in the web.config file. For eg:
static string constring;
protected void Page_Load(object sender, EventArgs e)
{
constring = ConfigurationManager.ConnectionStrings["myConn"].ConnectionString;
BindData();
}
protected void BindData()
{
using (SqlConnection con = new SqlConnection(constring))
{
con.Open();
SqlDataAdapter adap = new SqlDataAdapter("Select * from MyCustomers", con);
DataSet ds = new DataSet();
adap.Fill(ds, "MyCustomers");
GridView1.DataSource = ds.Tables[0];
GridView1.DataBind();
}
foreach (GridViewRow row in GridView1.Rows)
{
row.Attributes.Add("onmouseover", "className = 'rowStyle'");
row.Attributes.Add("onmouseout", "className = ''");
}
}
And run the Web site, Output will be shown like this