Click here to Skip to main content
15,944,397 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hello all,
Here is the scenario...I want to be able to use a gridview in 2.0 that is bound to a datasource. That's no problem. The first column in the gridview is a manufacturer part number. This data is going to be a link. When the user hovers over the link I want to have a tooltip immediately show up in the form of a bubble or balloon tooltip. The tooltip widow should point to another page that loads the detail information from the database for that part number. Here are the requirements as far as what I need and am looking for:
1) The tooltip must show up and stay in place immediately and state that the background data is "Loading..." (Preferably an animation for progress showing)
2) The toolip must not disappear when the mouse is over either the link or the tooltip itself.
Is this at all possible? I have found various balloon tooltips across the web, but none seem to conform to what I am looking for. I have been at this search for weeks can someone please help me or guide me in the right direction? I know that this is possible because I see it in those advertisements like "intellitxt".
Please help! :)

I googled "ajax tooltips" and got over 560,000 hits. I didn't investigate any of the links, but from the descriptions, they looked like they would be applicable. Chances are you're not going to find something that's a precise fit for your needs. That means that you'll have to fall back on your abilities as (gasp!) a programmer.
Share this answer
What you want is not exactly a tooltip. Instead you need to show a 'div' when you hover your mouseover that cell.

Now, here is the way to show/hide the div on mousehover/mouseout of gridview cell.
You need to use RowDataBound of GridView for this.
protected void GridView_RowDataBound(Object sender, GridViewRowEventArgs e)
   DataControlRowType rtype = e.Row.RowType;   
   if (rtype == DataControlRowType.DataRow && rtype != DataControlRowType.Footer 
       && rtype != DataControlRowType.Separator && rtype != DataControlRowType.Header 
       && rtype != DataControlRowType.Pager)   
      //Show div    
      e.Row.Attributes.Add("onmouseover", "ShowDiv(this);");
      //Hide div
      e.Row.Attributes.Add("onmouseover", "HideDiv(this);");

Show the div onmouseover event of the grid cell, and
Hide the div onmoustout event of the grid cell.

Now in the Javascript function, apart from showing the div you can show other stuffs like loading and other things you need to.
Share this answer
Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
' Assumes target cell is in column 2 and the underlying data item is sEmployeeName
If e.Row.RowType = DataControlRowType.DataRow Then
e.Row.Cells(2).Attributes.Add("Title", e.Row.DataItem("sEmployeeName").ToString)
End If
End Sub

This can help you to show the tooltip.

I didnt get that why you want to show loading on background. It is not expected to load a tooltip from the server when the user has kept the mouse on top of it. In this case the tooltip will show within no time.

Hope this is not what you expected....
Share this answer
Ranjith Reddy CSE 6-May-12 2:50am    
please can u send me this code in C#

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900