This is a migrated thread and some comments may be shown as answers.

RadTooltipmanager inside the radgrid problem

1 Answer 94 Views

ToolTip

This is a migrated thread and some comments may be shown as answers.

Suneetha asked on 19 Jul 2012, 07:29 PM

add.jpg

Hi,

I have the radgrid in a main page with link button column.I want to open a radtooltip in the linkbutton mousehover event.Every thing is working fine but i am getting error message like in the attached file.I did everything as the forum replies.But still no luck.Please chekc the below code and give me the solution.

Default.Aspx:

<telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="true" OnClientResized="ClientResized"

AutoGenerateColumns="False" AllowMultiRowSelection="true" OnNeedDataSource="RadGrid1_NeedDataSource"

PageSize="15" ShowStatusBar="True" AlternatingItemStyle-BackColor="LightBlue"

Skin="WebBlue" Width="100%" Height="650px" OnItemCreated="RadGrid1_ItemCreated"

OnItemDataBound="RadGrid1_ItemDataBound" Style="margin-top: 0px" OnDataBound="RadGrid1_DataBound"

OnItemCommand="RadGrid1_ItemCommand">

<MasterTableView ClientDataKeyNames="PUR_CAT,CAT_TOT,FTMC,TOT_PUR_CAT,Dependent_PO,Dependent_RM"

TableLayout="Fixed" Width="100%">

</EditColumn>

</EditFormSettings>

</RowIndicatorColumn>

</ExpandCollapseColumn>

<telerik:GridClientSelectColumn HeaderStyle-Font-Bold="true" UniqueName="ClientSelectColumn">

</telerik:GridClientSelectColumn>

<telerik:GridBoundColumn DataField="PUR_CAT" FooterText="Total:" HeaderStyle-Font-Bold="true"

HeaderStyle-Width="9%" HeaderText="Purchase Category">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="TOT_EXT_QTY" DataType="System.Double" HeaderStyle-Font-Bold="true"

HeaderStyle-Width="7%" HeaderText="Total Qty" ItemStyle-HorizontalAlign="Right"

UniqueName="TOT_EXT_QTY">

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn DataField="TOT_PUR_CAT,Dependent_PO" HeaderStyle-Font-Bold="true"

HeaderStyle-Width="40%" ItemStyle-HorizontalAlign="Left" UniqueName="TOT_PUR_CAT,Dependent_PO">

<tr>

-100</div>

100</div>

<telerik:RadSlider ID="RadSliderPOCAT" runat="server" MaximumValue="100" MinimumValue="-100"

OnClientSlideEnd="CalculateNewProductCostPO" OnClientSlideStart="ClientSlideStart"

OnClientValueChanged="ClientValueChangedPO" SelectionEnd="<%# POEndSlider %>"

SelectionStart="<%# POStartSlider %>" ShowDecreaseHandle="true" ShowIncreaseHandle="true"

Skin="Forest" SmallChange="1" Style="float: left" Value="0" Width="385px" CssClass="ApplyPosition" />

</td>

</tr>

PO Price

<tr>

<td align="justify" style="border-style: solid; border-color: #455F77; border-width: 1px;

width: 20%;">

Total PO Price

</td>

<td align="justify" style="border-color: #455F77; border-width: 1px; width: 20%;

border-right-style: solid; border-bottom-style: solid; border-top-style: solid;">

Future PO Price

</td>

<td align="center" style="border-color: #455F77; border-width: 1px; width: 20%; border-right-style: solid;

border-bottom-style: solid;">

Current Selection

</td>

<td align="justify" style="border-color: #455F77; border-width: 1px; width: 20%;

border-right-style: solid; border-top-style: solid; border-bottom-style: solid;">

Other Affected PO

</td>

<td align="justify" style="border-color: #455F77; border-width: 1px; width: 20%;

border-right-style: solid; border-bottom-style: solid; border-top-style: solid;">

Future Other Affected PO

</td>

</tr>

</caption>

</table>

</HeaderTemplate>

<tr>

<asp:Label ID="lbl_tot_putcat" runat="server" Text='<%#"$"+CheckEmpty(DataBinder.Eval(Container.DataItem,"TOT_PUR_CAT","{0:#,###0}"))%>'></asp:Label>

<%--<asp:Label ID="lbl_tot_putcat" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "TOT_PUR_CAT", "{0:C}")%>'></asp:Label>--%>

<%-- <%#DataBinder.Eval(Container.DataItem, "TOT_PUR_CAT", "{0:C}")%>--%>

</td>

<asp:Label ID="lbl_FUT_TOT_PUR_CAT" ForeColor="#3C0000" runat="server" Text='<%#"$"+CheckEmpty(DataBinder.Eval(Container.DataItem, "FUT_TOT_PUR_CAT", "{0:#,###0}"))%>'></asp:Label>

<%-- <%#DataBinder.Eval(Container.DataItem, "FUT_TOT_PUR_CAT", "{0:C}")%>--%>

</td>

<asp:Label ID="lblCurSelPO" runat="server" Text="Current Selection: 0" />

</td>

<%-- <%#CheckEmpty(DataBinder.Eval(Container.DataItem, "Dependent_PO", "{0:C}"))%>--%>

<asp:LinkButton ID="lnk_totpo" runat="server" ForeColor="Blue" Text=' <%#"$"+CheckEmpty(DataBinder.Eval(Container.DataItem, "Dependent_PO","{0:#,###0}"))%>'></asp:LinkButton>

</td>

<%-- <%#CheckEmpty(DataBinder.Eval(Container.DataItem, "FUT_Dependent_PO", "{0:C}"))%>--%>

<asp:Label ID="lnk_effpo" runat="server" Text='<%#"$"+CheckEmpty(DataBinder.Eval(Container.DataItem, "FUT_Dependent_PO", "{0:#,###0}"))%>'></asp:Label>

</td>

</tr>

<%-- <tr>

</tr>--%>

</table>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridTemplateColumn DataField="CAT_TOT,Dependent_RM" HeaderStyle-Font-Bold="true"

HeaderStyle-Width="40%" ItemStyle-HorizontalAlign="Left" UniqueName="CAT_TOT,Dependent_RM">

<tr>

-100</div>

100</div>

<telerik:RadSlider ID="RadSlider1" runat="server" MaximumValue="100" MinimumValue="-100"

OnClientSlideEnd="CalculateNewProductCost" OnClientSlideStart="ClientSlideStart"

OnClientValueChanged="ClientValueChanged" SelectionEnd="<%# endSlider %>" SelectionStart="<%# startSlider %>"

ShowDecreaseHandle="true" ShowIncreaseHandle="true" Skin="Forest" SmallChange="1"

Value="0" Width="385px" Style="float: left" CssClass="ApplyPosition" />

</td>

</tr>

Material Cost

<tr>

<td align="justify" style="border-style: solid; border-color: #455F77; border-width: 1px;

width: 20%;">

Total Material Cost

</td>

<td align="justify" style="border-color: #455F77; border-width: 1px; width: 20%;

border-right-style: solid; border-bottom-style: solid; border-top-style: solid;">

Future Total Material Cost

</td>

<td align="center" style="border-color: #455F77; border-width: 1px; width: 20%; border-right-style: solid;

border-bottom-style: solid;">

Current Selection

</td>

<td align="justify" style="border-color: #455F77; border-width: 1px; width: 20%;

border-right-style: solid; border-top-style: solid; border-bottom-style: solid;">

Other Affected RM

</td>

<td align="justify" style="border-color: #455F77; border-width: 1px; width: 20%;

border-right-style: solid; border-bottom-style: solid; border-top-style: solid;">

Future Other Affected RM

</td>

</tr>

</caption>

</table>

</HeaderTemplate>

<tr>

<asp:Label ID="lbl_CAT_TOT" runat="server" Text='<%#"$"+CheckEmpty(DataBinder.Eval(Container.DataItem, "CAT_TOT", "{0:#,###0}"))%>'></asp:Label>

<%--<%#DataBinder.Eval(Container.DataItem, "CAT_TOT", "{0:C}")%> <%#Eval("CAT_TOT") %>--%>

</td>

<asp:Label ID="lbl_FTMC" runat="server" Text='<%#"$"+CheckEmpty(DataBinder.Eval(Container.DataItem, "FTMC", "{0:#,###0}"))%>'></asp:Label>

<%-- <%#DataBinder.Eval(Container.DataItem, "FTMC", "{0:C}")%>--%>

</td>

<asp:Label ID="lblCurSel" runat="server" Text="Current Selection: 0" />

</td>

<asp:LinkButton ID="lnk_rm" runat="server" ForeColor="Blue" Text='<%#"$"+CheckEmpty(DataBinder.Eval(Container.DataItem, "Dependent_RM", "{0:#,###0}"))%>'></asp:LinkButton>

<%--<%#CheckEmpty(DataBinder.Eval(Container.DataItem, "Dependent_RM", "{0:C}"))%>--%>

</td>

<asp:Label ID="lnk_effrm" runat="server" Text='<%#"$"+CheckEmpty(DataBinder.Eval(Container.DataItem, "Future_Dependent_RM", "{0:#,###0}"))%>'></asp:Label>

<%--<%#CheckEmpty(DataBinder.Eval(Container.DataItem, "Future_Dependent_RM", "{0:C}"))%>--%>

</td>

</tr>

</table>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</ClientSettings>

</FilterMenu>

</telerik:RadGrid>

<telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" OffsetY="-1" EnableShadow="true"

Position="BottomRight" Animation="Fade" OnAjaxUpdate="OnAjaxUpdate" RelativeTo="Mouse"

Width="500px" Height="250px" Style="font-size: 18px; text-align: center; font-family: Arial;"

RenderInPageRoot="true" Skin="Forest" AutoCloseDelay="2000" HideDelay="0" ShowDelay="0"

ContentScrolling="Auto" ShowEvent="OnMouseOver" AnimationDuration="1" HideEvent="ManualClose">

</telerik:RadToolTipManager>

ASpx.CS:

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)

{

if (e.Item.ItemType == GridItemType.Item || e.Item.ItemType == GridItemType.AlternatingItem)

{

LinkButton lnk_rm1 = item.FindControl("lnk_rm") as LinkButton;

if (!Object.Equals(lnk_rm1, null))

{

if (!Object.Equals(this.RadToolTipManager1, null))

{

//Add the button (target) id to the tooltip manager

string str = (e.Item as GridDataItem).GetDataKeyValue("PUR_CAT").ToString().Replace("<br/>", "/");

string[] ariba_cat2 = str.Split('.');

string last = ariba_cat2[2];

this.RadToolTipManager1.TargetControls.Add(lnk_rm1.ClientID, last, true);

}

protected void OnAjaxUpdate(object sender, ToolTipUpdateEventArgs args)

{

this.UpdateToolTip(args.Value, args.UpdatePanel);

}

private void UpdateToolTip(string elementID, UpdatePanel panel)

{

Control ctrl = Page.LoadControl("CategoryDetailsfromIndex.ascx");

panel.ContentTemplateContainer.Controls.Add(ctrl);

CategoryDetailsfromIndex details = (CategoryDetailsfromIndex)ctrl;

details.Ariba21 = elementID;

}

protected void RadGrid1_ItemCommand(object sender, GridCommandEventArgs e)

{

if (e.CommandName == "Sort" || e.CommandName == "Page")

{

RadToolTipManager1.TargetControls.Clear();

}

CategoryDetailsfromIndex.Ascx

<telerik:RadGrid ID="RadGrid_det" runat="server" Skin="Forest">

</telerik:RadGrid>

CategoryDetailsfromIndex.Ascx.cs:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

namespace CPT_NEW

{

public partial class CategoryDetailsfromIndex : System.Web.UI.UserControl

{

Home obj = new Home();

private string Ariba2;

public string Ariba21

{

get { return Ariba2; }

set { Ariba2 = value; }

}

protected override void OnPreRender(EventArgs e)

{

base.OnPreRender(e);

RadGrid_det.DataSource = obj.Get_DetailsfromIndexMapping(Ariba21);

RadGrid_det.DataBind();

}

protected void Page_Load(object sender, EventArgs e)

{

}

Thanks.

1 Answer, 1 is accepted

answered on 23 Jul 2012, 10:40 AM

Hello Suneetha,

This alert box indicates a server error during the processing of the AJAX request the tooltip manager invokes to get its content. When AJAX is used the server errors get trapped like this. I, therefore, advise that you place a breakpoint in your code and step through it to see where it originates in order to fix it.

Another possible issue may be from the strings you pass as the value of the tooltips - if they contain special symbols it is possible that a coma (',') or a curly bracket ('{' or '}'), for example, can break the serialization of the data, so I would advise that you test with a different datasource or at least remove the value.

I also advise that you check your AJAX settings and especially avoid nested update panels. This online demo show the basic scenario and setup that work well, so you can use it as base to extend the logic.

Kind regards,
Marin Bratanov
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

RadTooltipmanager inside the radgrid problem

1 Answer, 1 is accepted