Rounded corner tooltip in IE7 with RadToolTipManager

2 posts, 0 answers
  1. Kiti
    Kiti avatar
    9 posts
    Member since:
    Jul 2011

    Posted 21 May 2012 Link to this post

    I have to attach the radgrid header with a tooltip. I am using RadToolTipManager but I need a rounded corner instead of rectangle/square with a pointing mouse. in IE7.

    CSS Class: 
    .radtooltip_Default, .radtooltip_Default td, .radtooltip_Default tr
    {
        background-color: Blue !important;
    }

    Aspx Page
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestTooltip.aspx.cs" Inherits="PriceRight.LaunchSequence.WebApplication.User.TestTooltip" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <link type="text/css" rel="stylesheet" media="all" href="../Resources/css/main.css" />  
        
      
        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
        <meta name="generator" content="HAPedit 3.1" />
        
       
    </head>
    <body>
        <form id="form1" runat="server">
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
        <div id="zone">
            <table>
                <tr>
                    <td>
                        <asp:Label ID="Label1" Text="Below is the data table" runat="server" Font-Size="Larger"></asp:Label>
                    </td>
                    <td>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    </td>
                    <td>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    </td>
                </tr>
            </table>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <table>
                <tr>
                    <td>
                        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                        </telerik:RadScriptManager>
                        <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" OnItemDataBound="RadGrid1_ItemDataBound">
                            <MasterTableView ShowHeadersWhenNoRecords="true">
                                <Columns>
                                    <telerik:GridBoundColumn DataField="ABC" HeaderText="ABC">
                                    </telerik:GridBoundColumn>
                                </Columns>
                            </MasterTableView>
                        </telerik:RadGrid>
                    </td>
                </tr>
            </table>
        </div>
       
        <telerik:RadToolTipManager ID="RadToolTipManager2" runat="server" AutoTooltipify="true"
            RelativeTo="Mouse" Position="TopCenter" ContentScrolling="Default" Width="150"
            EnableShadow="false" Height="10" ToolTipZoneID="zone">
        </telerik:RadToolTipManager>
       
        </form>
    </body>
    </html>
     TestTooltip .aspx.cs Page
    public partial class TestTooltip : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
                RadGrid1.DataSource = createDataTable();
            }


            protected void RadGrid1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
            {
                if (e.Item.ItemType == GridItemType.Header)
                {
                    GridHeaderItem item = e.Item as GridHeaderItem;
                    foreach (TableCell cell in item.Cells)
                    {
                        cell.ToolTip = "I am a textbox with some other very very very very very very long tooltip.Text";


                        // cell.ToolTip.
                        // cell.CssClass = "ToolTipContent";
                        // cell.ToolTip
                        //if ((cell.Controls.Count > 0))
                        //{
                        //    // add tooltip to header title link
                        //    RadToolTipManager1.TargetControls.Add(cell.ClientID, true);
                        //}
                    }
                }
            }


            private DataTable createDataTable()
            {
                DataTable dt = new DataTable();
                dt.Columns.Add("ABC");
                dt.Columns.Add("Column2");
                DataRow dr = dt.NewRow();
                dr["ABC"] = "Column1 - Row 1";
                dr["Column2"] = "Column2 - Row 1";
                dt.Rows.Add(dr);


                return dt;
            }
        }

    Please provide me  a solution.

    Thanks,
    Kiti




  2. Bozhidar
    Admin
    Bozhidar avatar
    679 posts

    Posted 21 May 2012 Link to this post

    Hi,

    Some of the Telerik embedded ToolTip skin have rounded corners, take a look at the demo pages and choose which one fits best your scenario.

    If you want something else you could Create RadToolTip custom skin.

    Note that Telerik does not support custom solutions and it`s a developer`s responsibility to create and maintain propely custom skins and/or behaviors.

    All the best,
    Bozhidar
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

Back to Top