Using dataviz chart components with kendo MVVM component

2 posts, 0 answers
  1. Anıl
    Anıl avatar
    6 posts
    Member since:
    Feb 2012

    Posted 08 May 2013 Link to this post

    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:

    @(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>);
              })
        )
    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,
  2. Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 09 May 2013 Link to this post

    Hello Anıl,

    I am not quite sure what causes the problem in your application - I tested the provided code and everything works as expected (attached is my test project). Could you please share more details - do you observe this issue in all browsers? 

    On a side note, if the issue persists only in IE - please check this troubleshooting sections which describes how to address the problem.
     
    Kind regards,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top