[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 612
  • Last Modified:

asp.net mouse over highlight on gridview with updatepanel grid

trying to display
highlight on gridview while mouseover with

protected void gvHrEmploye_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == System.Web.UI.WebControls.DataControlRowType.DataRow)
            {

                // when mouse is over the row, save original color to new attribute, and change it to highlight color
                e.Row.Attributes.Add("onmouseover", "this.originalstyle=this.style.backgroundColor;this.style.backgroundColor='#EEFFAA'");

                // when mouse leaves the row, change the bg color to its original value  
                e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=this.originalstyle;");


            }
        }

Open in new window


currently not achievable,
was wondering whether the gridview with update panel does not work
tried several methods with the hover,
0
doramail05
Asked:
doramail05
  • 2
1 Solution
 
Carl TawnSystems and Integration DeveloperCommented:
You could just use a simple CSS style to achieve the same thing:
<style type="text/css">

    tr { background-color: <your default colour>; }
    tr:hover { background-color: #EEFFAA }

</style>

Open in new window

You may need to be a little more explicit in the path for the style if you have multiple grids on the page if you only want the effect applied to one of them.
0
 
doramail05Author Commented:
worked with this :

protected void gvProduct_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            e.Row.Attributes["onclick"] = Page.ClientScript.GetPostBackClientHyperlink(gvProduct, "Select$" + e.Row.RowIndex);
            e.Row.Attributes.Add("onmouseover", "HighLightMe(this);");
            e.Row.Attributes.Add("onmouseout", "UnHighLightMe(this);");
        }
    }

  <script type="text/javascript">
       
        function HighLightMe(row) {
            row.originalColor = row.style.backgroundColor;
            row.style.backgroundColor = '#F8F2AF';
        }

        function UnHighLightMe(row) {
            row.style.backgroundColor = row.originalColor;
        }
    </script>
0
 
doramail05Author Commented:
got it worked
0

Featured Post

The 14th Annual Expert Award Winners

The results are in! Meet the top members of our 2017 Expert Awards. Congratulations to all who qualified!

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now