Hi,
I've got an existing web application that uses your ASP.NET AJAX library. it includes a number of pages where I can see that adding charts generated by the Kendo DataViz components would be really useful.
I've tried creating a test page that incorporates the client-side code from your Kendo 'Basic usage column chart' demo and it works fine. However, as soon as I add a RadScriptManager control to the page (which is needed by other ASP.NET AJAX controls) it generates an error 'Error: Object doesn't support property or method 'kendoChart'.
I've included my test page below. If you remove the three lines starting '<asp:ScriptReference...' the Kendo chart works again. I appreciate there are two copies of the JQuery library being loaded but removing the <script type="text/javascript" src="../Scripts/jquery.min.js"></script> line doesn't help either.
Is it possible to use Kendo components with a page that uses the RadScriptManager and other ASP.NET AJAX controls?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="../Styles/examples.css" rel="stylesheet"/>
<link href="../Styles/examples-offline.css" rel="stylesheet"/>
<link href="../Styles/kendo.common.min.css" rel="stylesheet"/>
<link href="../Styles/kendo.default.min.css" rel="stylesheet"/>
<script type="text/javascript" src="../Scripts/jquery.min.js"></script>
<script type="text/javascript" src="../Scripts/kendo.core.js"></script>
<script type="text/javascript" src="../Scripts/kendo.data.js"></script>
<script type="text/javascript" src="../Scripts/kendo.chart.js"></script>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager ID="rsmMain" Runat="server">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
</Scripts>
</telerik:RadScriptManager>
<div id="chart"></div>
<script type="text/javascript">
$(document).ready(function () {
$("#chart").kendoChart({
title: {
text: "My Chart Title"
},
series: [
{
name: "Series 1",
data: [200, 450, 300, 125]
}
],
categoryAxis: {
categories: [2000, 2001, 2002, 2003]
}
});
});
</script>
</form>
</body>
</html>
I've got an existing web application that uses your ASP.NET AJAX library. it includes a number of pages where I can see that adding charts generated by the Kendo DataViz components would be really useful.
I've tried creating a test page that incorporates the client-side code from your Kendo 'Basic usage column chart' demo and it works fine. However, as soon as I add a RadScriptManager control to the page (which is needed by other ASP.NET AJAX controls) it generates an error 'Error: Object doesn't support property or method 'kendoChart'.
I've included my test page below. If you remove the three lines starting '<asp:ScriptReference...' the Kendo chart works again. I appreciate there are two copies of the JQuery library being loaded but removing the <script type="text/javascript" src="../Scripts/jquery.min.js"></script> line doesn't help either.
Is it possible to use Kendo components with a page that uses the RadScriptManager and other ASP.NET AJAX controls?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="../Styles/examples.css" rel="stylesheet"/>
<link href="../Styles/examples-offline.css" rel="stylesheet"/>
<link href="../Styles/kendo.common.min.css" rel="stylesheet"/>
<link href="../Styles/kendo.default.min.css" rel="stylesheet"/>
<script type="text/javascript" src="../Scripts/jquery.min.js"></script>
<script type="text/javascript" src="../Scripts/kendo.core.js"></script>
<script type="text/javascript" src="../Scripts/kendo.data.js"></script>
<script type="text/javascript" src="../Scripts/kendo.chart.js"></script>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager ID="rsmMain" Runat="server">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
</Scripts>
</telerik:RadScriptManager>
<div id="chart"></div>
<script type="text/javascript">
$(document).ready(function () {
$("#chart").kendoChart({
title: {
text: "My Chart Title"
},
series: [
{
name: "Series 1",
data: [200, 450, 300, 125]
}
],
categoryAxis: {
categories: [2000, 2001, 2002, 2003]
}
});
});
</script>
</form>
</body>
</html>