RadHTMLChart binding issue with SQL Data source

[Paresh]

Hi,

I consider myself as newbie in Telerik. I am trying to bind RADHtmlChart to SQLDatasource and it works in other project except this specific one. Hope someone can point out the issue. If I load the same data in ASP Datagrid I can see it on my page. However both RadGrid and RadHTMLChart doesn't work. One more thing, the normal RadChart works fine with same data source.

ASPX Code

<telerik:RadHtmlChart ID="RadHtmlChart2" runat="server" DataSourceID="SqlDataSource1" Height="400px" Width="1200px" InvokeLoadData="OnPageLoad">
    <PlotArea>
        <Series>
            <telerik:LineSeries DataFieldY="47" Name="Lync"></telerik:LineSeries>
            <telerik:LineSeries DataFieldY="48" Name="Outlook"></telerik:LineSeries>
            <telerik:LineSeries DataFieldY="49" Name="IE"></telerik:LineSeries>
        </Series>
        <XAxis DataLabelsField="YDate" Name="ExecutionDate" Visible="true"></XAxis>
        <YAxis Name="ExecutionCount" MaxValue="1000" MinValue="0" Step="100"></YAxis>
    </PlotArea>
    </telerik:RadHtmlChart>

SQL DataSource

<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:SmartButton3ConnectionString %>"
SelectCommand="SELECT * FROM (SELECT CoreTriggerPluginID, CONVERT(VARCHAR(10),CreatedDateTime,101) as YDate
FROM [SmartButton3].[Universal].[TblCoreTriggerPluginUsage] where CoreTriggerPluginID IN (47,48,49)) X
PIVOT(COUNT(X.CoreTriggerPluginID)
      FOR X.CoreTriggerPluginID IN ([47], [48], [49])) AS PVTTable
      ORDER BY PVTTable.YDate"></asp:SqlDataSource>

[Danail Vasilev]

Hello Paresh,

The only problematic thing I can determine from the provided code snippet is that the data source field names start with numbers which are considered as special symbols and must be escaped. More details are available here.


Regards,
Danail Vasilev
Telerik

 

 

[Paresh]

Thanks for reply Danail. I've replaced my code to include names rather than numbers and looks like below. However it still displays a blank chart. Same goes with RADGrid, it doesn't display any data.

<telerik:RadHtmlChart ID="RadHtmlChart2" runat="server" DataSourceID="SqlDataSource1" Height="400px" Width="1200px">
        <PlotArea>
            <Series>
                <telerik:LineSeries DataFieldY="SbInternetExplorerHealthPluginV2" Name="IE"></telerik:LineSeries>
                <telerik:LineSeries DataFieldY="SbOutlookHealthV2" Name="Outlook"></telerik:LineSeries>
                <telerik:LineSeries DataFieldY="SbLyncHealthPlugin" Name="Lync"></telerik:LineSeries>
            </Series>
            <XAxis DataLabelsField="YDate" Name="ExecutionDate" Visible="true"></XAxis>
            <YAxis Name="ExecutionCount"></YAxis>
        </PlotArea>
        </telerik:RadHtmlChart>

[Paresh]

Correction - Same DataSource works with RADGrid and displays the data.

[Paresh]

Can someone please help on this one?

[Paresh]

It finally worked after recreating the chart. The code now looks as one below.

<telerik:RadHtmlChart ID="RadHtmlChart2" runat="server" DataSourceID="SqlDataSource1">
                    <Legend>
                        <Appearance Position="Bottom" />
                    </Legend>
                <PlotArea>
                    <Series>
                        <telerik:LineSeries DataFieldY="SbInternetExplorerHealthPluginV2" MissingValues="Zero" Name="SbInternetExplorerHealthPluginV2">
                        <LabelsAppearance Visible="false"></LabelsAppearance></telerik:LineSeries>
                        <telerik:LineSeries DataFieldY="SbOutlookHealthV2" MissingValues="Zero" Name="SbOutlookHealthV2">
                        <LabelsAppearance Visible="false"></LabelsAppearance></telerik:LineSeries>
                        <telerik:LineSeries DataFieldY="SbLyncHealthPlugin" MissingValues="Zero" Name="SbLyncHealthPlugin">
                        <LabelsAppearance Visible="false"></LabelsAppearance></telerik:LineSeries>
                    </Series>
                    <XAxis DataLabelsField="YDate" Name="Date"><LabelsAppearance RotationAngle="60" /> <MinorGridLines Visible="false" /><MajorGridLines Visible="false" /></XAxis>
                    <YAxis><MinorGridLines Visible="false" /><MajorGridLines Visible="false" /></YAxis>
                </PlotArea>
            </telerik:RadHtmlChart>