HtmlChart with JDash dashlets

[Gert]

Hi.

I was wondering if somebody could help me as this problem has had me stumped for the past few weeks.

I am using the Telerik Ajax Components (version 2014.1.403.45) along with JDash. In my appliation I wish to create a Dashboard using JDash and inside the JDash dashlets would like to place Telerik controls, specifically the RadHTMLchart. But no matter what I do I always receive the following error:

Uncaught TypeError: Cannot read property 'dataviz' of undefined

A quick search from Google shows several other people struggling with the same error, but sadly either nobody has received a solution or bothered to post one. Here are the links showing others having the same problem:

http://feedback.telerik.com/Project/108/Feedback/Details/132936-improve-integration-between-radhtmlchart-and-jdash
http://forum.jdash.net/yaf_postst147_Telerik-RadHTMLChart-controls-no-longer-work-with-dashboard.aspx

Does anybody here have a possible solution? Any help would be very much appreciated!

Thanks!

[Danail Vasilev]

Hi Gert,

Generally, JDash framework is a third party software that is not related to Telerik UI for ASP.NET AJAX suite. Therefore, we cannot guarantee whether it can or cannot work properly with our controls, andsuch an integration hasn't gone through testing.

What I can suggest at this point is the following:
  - Try to disable the embedded scripts of RadHtmlChart and JDash and load them externally. You can try to load JDash scripts prior or after RadHtmlChart's ones. For example:
ASPX:

<asp:ScriptManager ID="ScriptManager1" runat="server">
    <Scripts>
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryPlugins.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.html5.dataviz.js" />
        <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.HtmlChart.RadHtmlChart.js" />
        <asp:ScriptReference Path="additionalScripts.js" />

    </Scripts>
</asp:ScriptManager>
<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" EnableEmbeddedScripts="false">
....
</telerik:RadHtmlChart>

The above RadHtmlChart script references are related to the older versions of the controls. If, however,  you are using one of the latest official version of Telerik UI you can use the following script references:

<Scripts>
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryPlugins.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.html5.core.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.html5.dataviz.core.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.Data.html5.data.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.html5.userevents.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.DataViz.html5.dataviz.themes.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.DataViz.html5.dataviz.chart.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.DataViz.html5.dataviz.svg.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.DataViz.html5.dataviz.vml.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.HtmlChart.RadHtmlChart.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.DataViz.html5.dataviz.chart.funnel.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.DataViz.html5.dataviz.chart.polar.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.DataViz.html5.dataviz.sparkline.js" />
    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.HTML5UI.DataViz.html5.dataviz.stock.js" />
    <asp:ScriptReference Path="additionalScripts.js" />
</Scripts>

More information is available in the Disabling Embedded Resources help article.

   - Contact the JDash support for assistance. The RadHtmlChart only uses the global window.kendo object and the global jQuery object. When the Kendo scripts (the RadHtmlChart control is based on the Kendo DataViz chart widget) are brought via RadHtmlChart the kendo object works with the global window.$telerik.$ object where our jQuery is stored. It is version 1.9.2. I hope this information will help their support team.
  - Generally Telerik UI controls are tested with Sitefinity, so that I can suggest that you use it as your CMS.
   - Currently you are the second person that has had difficulties with the integration of RadHtmlChart and the JDash framework.  We have already created such a feedback item here, so that you can raise its priority by voting on it and follow its progress. If the item accumulates enough votes we can reopen this case and investigate it again.

Regards,
Danail Vasilev
Telerik

 

 

[Austin]

Has anyone found a solution to this or did this solution work for anyone.  We have been unable to update our telerik version because newer versions break in the jdash dashboard.  We have searched for months for a solution and cannot find a fix.  At this point we are considering switching our charting controls to another company.

[Danail Vasilev]

Hi Austin,

I am sorry to say that due to the low priority of this feedback item it hasn't been investigated further. What I can suggest at this point is that you try to disable the internal jQuery of Telerik UI controls and use an external one - common for Telerik UI suite and jDash. You can examine the Using jQuery help article and especially the "Including external jQuery" section for details on the matter.

Regards,
Danail Vasilev
Telerik