How to add a tooltip on mouse over on the Grid View Column Heading

Question

When the user hover overs the column heading of a column in gridview for eg: Column Heading Year, when I hover over Year I should see an explanation of what that Year means "This is the year when the student joined the college etc".

Below is my ascx code:

 <asp:GridView ID="grdView" runat="server" Width="900px" AutoGenerateColumns="False"
                AllowPaging="true" AllowSorting="true" CellSpacing="0" CellPadding="5" PageSize="20"
        OnRowDataBound="grdView_RowDataBound">
                <Columns>
 <asp:TemplateField HeaderText="ID Number" ItemStyle-Width="90px" >
    <ItemTemplate>
      <asp:Label ID="Label1" runat="server" Text='<%# Bind("ID")%'></asp:Label>
    </ItemTemplate>
 </asp:TemplateField><asp:BoundField DataField="StudentName" HeaderText="StudentName"> </asp:BoundField>

Please let me know how could I have hover over texts or tooltips on column headings of my gridview. Thanks,

Answer 1

In your code behind, create the method rowDataBound for the GridView and add the below code

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.Header)
    {
        foreach (TableCell cell in e.Row.Cells)
        {
            cell.Attributes.Add("title", "Tooltip text for " + cell.Text);
        }
    }
}

Don't forget to set the attribute OnRowDataBound in the GridView.

http://rosshawkins.net/archive/2007/04/15/adding-tooltips-to-gridview-headers.html.aspx