How to Display TOOL TIP in Asp.net Gridview Column.

Question

0.00/5 (No votes)

See more:

How to Display TOOL TIP in Gridview Column.
====================================

am working on asp.net c# sqlServer2005.

i have large amount of data in database i have displayed in gridview its fine.

i have one column in Gridview with name Days. In this column i have M T W Th F S Su 0.

so when the user keeps the mouse pointer on M it should Monday and
T - Tuesday
W- Wednesday
Th-Thursday
F - Friday
S- Saturday
Su - Sunday
0 - Not Available.

Please can u help me how to set tooltip for this column.

In one column i should display 8 tool tips.

Please help Thanks.

Posted 12-Jan-13 21:59pm

Ranjith Reddy CSE

Add a Solution

Comments

Tharaka MTR 13-Jan-13 4:03am

This question is a re-post.

Ranjith Reddy CSE 13-Jan-13 4:58am

Sir, Still i didnt get the answer for this solution....Please help.

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

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

Sandeep Mewara · Answer 1 · 2013-01-13T04:07:00

how to set it for OutSide the Gridview not a Inside Gridview.
For this, you need to have javascript onmousein & onmouseout for the control. In the JS method, show/hide a div placed somewhere as per your need. This div will have text that you want to show.

You can do the following by:
1. Inject Javascript function on mousehover & mouseout of the link in a grid row.
2. Using JavaScript, show a div that contains the needed details(image here) when you hover your mouseover that row
3. Using JavaScript, hide the div onmouseout.

For injecting JS, you need to use RowDataBound of GridView, something like:

C#

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)  
   { 
      // Control specific
      TextBox tb = (TextBox)e.Row.FindControl("myTextBox");
      
      // Show div         
      tb.Attributes.Add("onmouseover", "ShowDiv(this);");
      //Hide div
      tb.Attributes.Add("onmouseover", "HideDiv(this);");
   }
}

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

Put the same logic for any/all controls that you want to have it.

Try!

NeerajBhagat09 · Answer 2 · 2013-01-13T11:31:00

Other way of doing this is from code behind.

If your gridview is a templeted one, code should be something like this:

XML

<asp:TemplateField HeaderText="Day">
<ItemTemplate>
<asp:Label ID="lblDay" runat="server" Text='<%# Bind("Days") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>

In the GridView_RowDataBound event, you can get the control which displays the day from database for each row, as mentioned above by Sandeep. i.e

protected void GridView1_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)
           {
               Label lbl = (Label)e.Row.FindControl("lblDay");
               switch (lbl.Text)
               {
                   case "M":
                      lbl.ToolTip = "Monday";
                      break;
                   case "T":
                       lbl.ToolTip ="Tuesday";break;

                  // So on for your remaining days.

                }

Hope this helps.

How to Display TOOL TIP in Asp.net Gridview Column.

2 solutions

Solution 1

Solution 2

Add your solution here

Preview 0