I'm trying to use the mentioned kendo ui components together. I came across this sample in js fiddle, it works like a charm. But when I try to use the same code in my asp.net mvc project, my chart is not being rendered as expected.
Below you can find the code in my project:
I'm not getting the expected result. Here I asked the same question on stackoverflow, there you can find the result screen shot. What am I doing wrong?
Thanks,
Below you can find the code in my project:
@(Html.Kendo().TabStrip()
.Name("tabstripChart")
.Items(tabstrip =>
{
tabstrip.Add().Text("Chart")
.Selected(true)
.Content(
@<
text
>
<
div
id
=
"symbolChart"
data-role
=
"chart"
data-series
=
"[{ field: 'Hours' }]"
data-category-axis
=
"{ field: 'Label' }"
data-series-defaults
=
"{ type: 'line' }"
data-bind
=
"source: Activity"
>
</
div
>
<
script
type
=
"text/javascript"
>
alert("hey");
var viewModel = kendo.observable({
Activity: [
{ Label: "Jan", Hours: 10 },
{ Label: "Feb", Hours: 5 }
]
});
kendo.bind($("#symbolChart"), viewModel);
</
script
>
</
text
>
);
tabstrip.Add().Text("Realtime Chart")
.Content(@<
text
></
text
>);
})
)
Thanks,