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
close icon

Load event never fires

The load event for my chart never fires:
@usingSyncfusion.JavaScript
@usingSyncfusion.MVC.EJ
@usingSyncfusion.JavaScript.DataVisualization
@usingSyncfusion.JavaScript.DataVisualization.Models
 
<div>
@(Html.EJ().Chart("container")
.PrimaryXAxis(pr=>pr.AxisLine(ax=>ax.Visible(false)).MajorGridLines(mr=>mr.Visible(false))
.MajorTickLines(mt=>mt.Visible(false)).Title(tl=>tl.Text("Depth"))
.Range(ra=>ra.Min(8430).Max(8540).Interval(10)))
.PrimaryYAxis(pr=>pr.Title(tl=>tl.Text("Percent")).Range(ra=>ra.Min(0).Max(100).Interval(10)))
.Series(ser=>
{
ser.Type(SeriesType.StackingArea).Add();
ser.Type(SeriesType.StackingArea).Add();
ser.Type(SeriesType.StackingArea).Add();
})
.Load("onchartload")
.IsResponsive(true)
.Title(t=>t.Text("Chart"))
.Size(sz=>sz.Height("400")))
div>
 
<scriptsrc="~/Scripts/jquery-2.2.0.min.js">script>
 
<scripttype="text/javascript">
varchartobj;
 
functiongetData()
{
$.ajax({
type:"POST",
url:'@Url.Action("LithData","Mobile")?jobId='+@ViewBag.JobId,
async:false,
success:function(data)
{
for(vari=0;i)
{
if(i==data[i].Id)
{
chartobj.model.series[i].dataSource=data[i].data;
chartobj.model.series[i].xName="xvalue";
chartobj.model.series[i].yName="yvalue";
}
}
},
error:function()
{
alert("failed");
}
});
}
 
functiononchartload(sender)
{
chartobj=this;
getData();
}
 
script>

onchartload never get called.
What am I missing?


6 Replies

SK Saravana Kumar Kanagavel Syncfusion Team December 16, 2016 12:49 PM UTC

Hi Dennis, 
 
Thanks for using Syncfusion products. 
 
We have analyzed the code snippet provided by you and found that there is no space between the keyword "function" and function name "onchartload". 
 
We have prepared a simple sample using the above code and it can be downloaded from the following link 
 
[Chart with load event] 
 
 
Please let us know if you have any concern. 
 
Regrds, 
Anand 



DK Dennis Kroger December 16, 2016 03:07 PM UTC

The missing space occurred during the copy and paste and my failure to proofread before posting. If you look at the code you will notice that all spaces have been removed.
There is something else wrong in my project.
I will examine your post and return for follow-up.

Thanks.



DD Dharanidharan Dharmasivam Syncfusion Team December 19, 2016 12:09 PM UTC

Hi Dennis, 
 
Thanks for your update.We wait to hear from you.  
Please let us know, if you have any concern. 

Dharani. 



DK Dennis Kroger December 19, 2016 03:04 PM UTC

I do not understand why my project is behaving so differently from yours. When I run your project the SyncFusion chart renders as foloows:

<script type='text/javascript'>$(function($){$("#container").ejChart({"series":[{"cornerRadius":{"top":0,"bottom":0,"left":0,"right":0},"type":"stackingarea"},{"cornerRadius":{"top":0,"bottom":0,"left":0,"right":0},"type":"stackingarea"},{"cornerRadius":{"top":0,"bottom":0,"left":0,"right":0},"type":"stackingarea"}],"commonSeriesOptions":{"type":"column","cornerRadius":{"top":0,"bottom":0,"left":0,"right":0},"marker":{},"errorBar":{}},"primaryXAxis":{"axisLine":{"visible":false},"majorGridLines":{"visible":false},"majorTickLines":{"visible":false},"orientation":"horizontal","labelIntersectAction":"none","title":{"text":"Depth","font":{}},"scrollbarSettings":{"range":{}},"range":{"min":8430,"max":8540,"interval":10}},"primaryYAxis":{"orientation":"vertical","labelIntersectAction":"none","title":{"text":"Percent","font":{}},"scrollbarSettings":{"range":{}},"range":{"min":0,"max":100,"interval":10}},"size":{"height":"400"},"title":{"text":"Chart","font":{}},"isResponsive":true,"enable3D":false,"legend":{"font":{}},"load":"onchartload"});});</script>

When I run mine it renders as:

<div id="container" data-role="ejchart" data-ej-series='[{"cornerRadius":{"top":0,"bottom":0,"left":0,"right":0},"type":"StepLine"},{"cornerRadius":{"top":0,"bottom":0,"left":0,"right":0},"type":"StepLine"},{"cornerRadius":{"top":0,"bottom":0,"left":0,"right":0},"type":"StepLine"}]' data-ej-commonseriesoptions-type='column' data-ej-commonseriesoptions-cornerradius-top='0' data-ej-commonseriesoptions-cornerradius-bottom='0' data-ej-commonseriesoptions-cornerradius-left='0' data-ej-commonseriesoptions-cornerradius-right='0' data-ej-primaryxaxis-axisline-visible='false' data-ej-primaryxaxis-majorgridlines-visible='false' data-ej-primaryxaxis-majorticklines-visible='false' data-ej-primaryxaxis-orientation='horizontal' data-ej-primaryxaxis-labelintersectaction='none' data-ej-primaryxaxis-title-text='Depth' data-ej-primaryxaxis-range-min='8430' data-ej-primaryxaxis-range-max='8530' data-ej-primaryxaxis-range-interval='10' data-ej-primaryyaxis-orientation='vertical' data-ej-primaryyaxis-labelintersectaction='none' data-ej-primaryyaxis-title-text='Percent' data-ej-primaryyaxis-range-min='0' data-ej-primaryyaxis-range-max='100' data-ej-primaryyaxis-range-interval='10' data-ej-size-height='400' data-ej-title-text='Lithology' data-ej-isresponsive='true' data-ej-enable3d='false' data-ej-load='onchartload' ></div>
I have examined both projects yet I have not determined the difference that is causing this. Why is yours rendering as a script and mine is rendering as a div?
I must be something rather simple that I am missing.



DK Dennis Kroger December 19, 2016 08:43 PM UTC

The reason for the different rendering is due to this key in the web.config file:
<add key="UnobtrusiveJavaScriptEnabled" value="false"/>

I had it set to true.


DD Dharanidharan Dharmasivam Syncfusion Team December 20, 2016 05:47 AM UTC

Hi Dennis, 

Thanks for your update. 

Unobtrusive JavaScript support will create the components with basic level HTML tag-like structure in order to reduce the weightage of the page. If you use unobtrusive support, chart will render tag like structure else chart will render as script. 

For more information on Unobtrusive, kindly follow the below link 

However, if you set UnobtrusiveJavaScriptEnabled to false, chart will not render in unobtrusive mode. 

Thanks, 
Dharani. 


Loader.
Live Chat Icon For mobile
Up arrow icon