We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to load chart data with ajax?

Thread ID:





119882 Aug 10,2015 02:06 PM UTC Aug 17,2015 01:17 PM UTC ASP.NET MVC 5
Tags: Chart
Asked On August 10, 2015 02:06 PM UTC

I have a function in my controller that returns chart data as serialized json string (GetChartData()). I put the return of this function in a viewbag variable:

ViewBag.ChartData = GetChartData();

I have two types of code in onChartLoad function in my view. The first one works but the second one does not work.

1. It work...
function onChartLoad(sender){
sender.model.series[0].dataSource = @Html.Raw(ViewBag.ChartData)
sender.model.series[0].xName = "XValue";
sender.model.series[0].y = "YValue";

2. But when I use ajax, the chart does not drawn and there is no javascript error:
fucntion onCharLoad(sender){
sender.model.series[0].dataSource = data;
sender.model.series[0].xName = "XValue";
sender.model.series[0].y = "YValue";

When I alert @Html.Raw(ViewBag.ChartData) it shows me list of [Object object] but when alert data returned by ajax it shows me real data in json format, where as @ViewBag.ChartData is data returned by GetChartData() function (the same function when I access it via ajax).


Vinothkumar Arumugam [Syncfusion]
Replied On August 11, 2015 12:12 PM UTC

Hi Beeseda,

Sorry for the inconvenience caused.

Currently chart load event not properly working in MVC. So we have logged an issue report for this. The fix for this issue will be included in our upcoming Service pack release which is scheduled in August 2015 last week.  

Please let us know if you have any concern.


Vinothkumar Arumugam.

Replied On August 12, 2015 04:19 AM UTC

Hi, thanks for your reply.
My data is in the server on database and I want the chart to load its data for example every 30 seconds. So would you please help me how can I do this?
Thanks again.

Vinothkumar Arumugam [Syncfusion]
Replied On August 13, 2015 10:47 AM UTC

Hi Beeseda,
We have analyzed your reported query. We have prepared a sample based on your requirements. We have created a local database “ChartData” and table name “Chart”. Which contains three fields one for id another two for chart series point values X and Y.
In our sample chart table loaded five data to the series every 3 seconds. Chart table contains 15 data’s.  Please find the following code snippet to achieve your requirements.
Code Snippet [ASP]:

·         Add data to the chart model from database as follows.

·         Client side Ajax method load every 3 seconds as follows.


·         First time chart loaded initial data from source as below figure shows that.

·         After Click the AddData button Chart loaded five new data from data base until 15 data’s from table.

Since we have 15 data’s after three updates the update will be stop.
We have made a sample for this. You can download it from below sample location.
Sample Location:

Please let us know if you have any concern.
Vinothkumar Arumugam.

Replied On August 15, 2015 07:55 AM UTC

Thanks a lot.

Vinothkumar Arumugam [Syncfusion]
Replied On August 17, 2015 01:17 PM UTC

Hi Beeseda,
Thanks for the update.
Please let us know if you have any concern.
VInothkumar Arumugam.


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon