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

Reacting to a change in a RadChart

5 Answers 70 Views
Chart (HTML5)
This is a migrated thread and some comments may be shown as answers.
FIMS Computing Services FIMS - UWO
Top achievements
Rank 1
FIMS Computing Services FIMS - UWO asked on 21 Aug 2013, 05:40 PM
Hello,
I'm trying to make a Chart change its displayed info according to what data is displayed in a RadGrid after a filter is used. Allowing for a user to view the data in 2 forms.

Example:  When first loading the page the grid contains 96 results and the chart displays the data accordingly with a total of 96 as well.  However, once a user were to use a filter (such as only wanting to see usernames that contain the letter 'z') and hits enter the grid changes to only display 3 results but the chart still displays 96 from its original view.

What is the correct way of accomplishing this task?  I've attempted several events from the grid:
- OnItemCommand()
- OnItemDataBound()

As well as Chart methods like PreRender()

I've been able to hold the required data the Chart should display in a list but it just won't refresh like the Grid does when a filter is used.
Any ideas?

5 Answers, 1 is accepted

Sort by
0
Barbaros Saglamtimur
Top achievements
Rank 1
answered on 22 Aug 2013, 07:02 AM
Don't they share same type of data source? In my case they share same type, and I bind data to radchart after radgrid databound.There are other solution but this was the easiest way for me.
protected void RadGrid1_DataBound(object sender, EventArgs e)
{
    List<IsletmeRaporu> theBoundData = (List<IsletmeRaporu>)RadGrid1.DataSource;
    RadHtmlChart1.DataSource = theBoundData;
    RadHtmlChart1.DataBind();
}
Hope this helps.
0
FIMS Computing Services FIMS - UWO
Top achievements
Rank 1
answered on 22 Aug 2013, 03:05 PM
I get the data correct sure when debug/seeing the contents of the chart.  

The issue however is, even in the databound() event of the grid.  The chart won't update its image, such as Bar A saying 517 but should be significantly lower after a filter search.  The grid updates and shows the lower number of results but the chart doesnt.  It's simply the issue of postback/refreshing the page after the filter I am having an issue with.
0
Barbaros Saglamtimur
Top achievements
Rank 1
answered on 23 Aug 2013, 10:19 AM
It's interesting. I use exactly same code as I mentioned and works fine (both grid and chart is on an update panel). Which version of radcontrols are you using?
0
FIMS Computing Services FIMS - UWO
Top achievements
Rank 1
answered on 23 Aug 2013, 01:22 PM
My Telerik.Web.UI.dll version is 2013.2.611.45

What about your auto postback settings?  It sounds like your code should be all that's required but I guess their may be something really small that is enabled/disabled that's causing the difference.
0
Barbaros Saglamtimur
Top achievements
Rank 1
answered on 26 Aug 2013, 06:51 AM
I trigger update panel with with javascript. Both grid and chart call same function, which updates a hiddenfield's value. On post back I read hiddenfield's value and refresh datasource.
Here is my js
function refresh(sn, c) {
    var hiddenField = $get("HiddenField1");
    if (hiddenField) {
        hiddenField.value = sn + "|" + c;
        setTimeout(function () { __doPostBack(hiddenField.id, ''); }, 100);
    }
}

Adding the caller function to grid's hyperlinkcolumn
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
        {
            if (e.Item is GridDataItem)
            {
        GridDataItem item = (GridDataItem)e.Item;
                HyperLink hyplnkQn = (HyperLink)item["textColumn"].Controls[0];
        ...
        ...
        string clickTxt = string.Format("refresh('{0}','{1}');", sn, di.Text);
                hyplnkQn.Attributes.Add("onclick", clickTxt);
         }
    }

And chart
<telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" Width="650px" Height="550px"
                            OnClientSeriesClicked="OnClientSeriesClicked">
function OnClientSeriesClicked(sender, args) {
    var c = args.get_category();
    var sn = args.get_seriesName();
    refresh(sn, c);
}

Hope this helps.

By the way I am using version 2013.2.806.40
Tags
Chart (HTML5)
Asked by
FIMS Computing Services FIMS - UWO
Top achievements
Rank 1
Answers by
Barbaros Saglamtimur
Top achievements
Rank 1
FIMS Computing Services FIMS - UWO
Top achievements
Rank 1
Share this question
or