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. Image for the cookie policy date

Problem loading a Chart using JQuery

Hello,

I would like to render a chart from a controller action using Ajax.

So i create a regular controller rendering a view with a MVCChartModel and i load it using JQuery $.load().

I get the chart, but there is javascript error from the scripts render by syncfusion controller. 
It is also not possible to use the print button or any tooltip this way

I there any way this would work? What did i do worng ?

I have attached a sample recreating my problem

Thank you for your time.




EditionSyncfusion_7fe3f0fe.zip

8 Replies

AT Anandaraj T Syncfusion Team June 7, 2013 09:44 AM UTC

Hi Decker,

 

Thanks for using Syncfusion products.

 

Generally, the chart component is registered and necessary scripts required by the chart are added in the layout file. When chart is loaded without registering the chart component and scripts required, chart image will be displayed but interactive features such as zooming, tooltip, etc., will not work without registering the scripts and it will cause script error.

 

Please refer the following code snippet to register the chart component and scripts required for chart:

<code>

[CSHTML]

@(Html.Syncfusion().StyleManager().Combine(true).Minify(true)

        .Register(component =>

            {

                

                component.Add(ComponentType.Chart);

               

                component.Add("~/Content/Site.css");

              

            }))

 

@{Html.Syncfusion().ScriptManager().Combine(true).Minify(true).Render();}

 

</code>

 

Please download the modified sample attached to render chart without any script errors.

 

For printing the chart, please refer our online sample for printing the chart in the following link:

Chart Printing

 

Please let us know if you have any concerns.

 

Regards,

Anandaraj

 



EditionSyncfusion_11d79fd7.zip


DE Decker June 7, 2013 12:35 PM UTC

Hello,

Thank you for helping me.

I'm trying to add print and tooltip option to the sample you gave me back, it seems the syncfusion javascript library need MicrosoftAjax.js and MicrosoftMvcAjax.js library in order to work.

Are those two files mandatory in order to use Syncfusion Chart in ASP MVC ?




AT Anandaraj T Syncfusion Team June 17, 2013 11:06 AM UTC

Hi Decker,

Thanks for the update.

Interactive features such as tooltip, printing, etc., requires jquery-<version>.js, MicrosoftAjax.js and MicrosoftMvcAjax.js libraries to work. If the script libraries are not used it will cause script error because the chart scripts for these features require these scripts.

Please let us know if you have any concerns,

Regards,
Anandaraj


VC Vincent Caron June 21, 2013 08:37 AM UTC

Since my last message I bought the last version of essential studio ASP MVC (11.2.0.25) and I’m still struggling to print a chart which was load from a JQuery call.

In my last sample, loading the chart no longer causes an error nonetheless the print function still not work

I know that I’m using the chart in an unconventional way, but if you could take a look at my example and explain why I can’t print, I would appreciate.

Thank you for your time.



SyncfusionMvcApplication3_203639db.zip


VC Vincent Caron June 21, 2013 08:44 AM UTC

Just to clarify, I am ‘Decker’, I use this account now because the license was bought with it (company account).



BK Bharathiraja K Syncfusion Team June 26, 2013 03:30 PM UTC

Hi Decker,

 

Thanks for your update.

 

Print the chart image from the mvc model we suggest you to enable the “PrintButtonVisible” property and now print image button will be display on chart control. When we double click on that print image button the post action method will be call and chart is export to print.

 

Please find the below code snippet to achieve this.

 

[C#]

 

        [AcceptVerbs(HttpVerbs.Post)]

 

        public ActionResult MyChart(MVCChartModel chartModel, ChartParams ChartParamsData)

        {

            chartModel = CreateModel(dateStart, dateEnd);

 

            ChartSeries series = CreateSeries(dateStart, dateEnd);

 

            chartModel.Series.Add(series);

 

            chartModel.PrimaryXAxis.LabelIntersectAction = ChartLabelIntersectAction.Rotate;

 

            return chartModel.ChartActionResult(ChartParamsData);

 

        }

 

For your convenience we have modified your sample’s “ChartGeneratorController” file for print the chart image please download the file from the below link.

controller.zip

 

For more details regarding printing the chart image please refer our online document link.

http://help.syncfusion.com/ug/asp.net%20mvc/chart/documents/printing.htm

 

Printing the chart image using J-query (client side) we are validating this query and will update you with further details in two business day (June/28/2013).

 

Please let us know your concerns.

 

Thanks,

Bharathiraja K.

 

 



DE Decker July 2, 2013 03:57 PM UTC

Thank you for the help I didn’t realize the post action was necessary in order to print.

I read the documentation you mention, but I missed something:

When you need parameters from the client in order to generate a chart, how can you pass them to the print method? 

For example in my demon what if I need this ?

  public ActionResult MyChart(DateTime dateStart, DateTime dateEnd)

   { … }

How should I write my Post methode to print the same chart ?

Thank you for your help


AT Anandaraj T Syncfusion Team July 5, 2013 05:48 AM UTC

Hi Decker,

Thanks for your patience.

We have modified the sample provided by you in your update for printing the chart in post method. We have also added a function "PrintingImage" in the sample to print the chart in client side when "Print the Chart" button is clicked.

Please download the sample attached and let us know if you have any concerns.

Regards,
Anandaraj


SyncfusionMvcApplication3_da7d3ba3.zip

Loader.
Live Chat Icon For mobile
Up arrow icon