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
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
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>
</td>
<td>
</td>
</tr>
</table>
<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<%@ 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>
</td>
<td>
</td>
</tr>
</table>
<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>
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
1 Answer, 1 is accepted
0
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
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 >>