my datasource is my model...

4 posts, 0 answers
  1. Luca
    Luca avatar
    11 posts
    Member since:
    Jul 2012

    Posted 29 Oct 2015 Link to this post

    Hi there,

     I need some help with the "conversion" of a datasource into a view model.

    I made a simple page for test and I started it with some local JSON, the page is the following one:

    <div id="mvvm">

    <span data-bind="text: title"></span>

    <div id="chart" data-role="chart" data-bind="source: dsChart" ....... />

    </div>

    <script>

    var view  = kendo.observable({ title: "TEST", dsChart: [{ Name: "John", Surname: "West" }] });

    kendo.bind($("#mvvm"), view); 

    </script>

    This worked just fine. After it I decide to move on and bind the view with remote data from a WCF application. The application returns exactly the same JSON I wrote in the view: { title: "TEST", dsChart: [{ Name: "John", Surname: "West" }]

    So I added the remote datasource in the code:

    var view  = kendo.observable({ model: new kendo.data.DataSource({ transport: { read: { data: "http....", dataType: "json" }}}});

    when I did this the application stopped working, so I tried to change kendo.bind like I saw in some post here:

    kendo.bind($("#mvvm"), view.model); 

    kendo.bind($("#mvvm"), view.model.view()); 

    kendo.bind($("#mvvm"), view.model.view()[0]); 

    Of course none of this code worked... Would you please help me understand what I'm doing wrong here. This is just a simple test, but what I'm trying to do is to get all the data ( labels, texts, styles, datasource for grids and charts ) as JSON from web service and build the page with view model.

    Thanks

     

     
     
     
     
     
  2. Luca
    Luca avatar
    11 posts
    Member since:
    Jul 2012

    Posted 30 Oct 2015 in reply to Luca Link to this post

    I checked some post in this forum and I found this: http://www.telerik.com/forums/using-the-same-model-for-datasource-and-view

    I tried to do the same but with no luck...

    var view  = kendo.observable({

    pageModel: [],

    model: new kendo.data.DataSource(

    { transport: { read: { url: "http....", dataType: "json" }},

    requestEnd: function() { view.set("pageModel", this.view()); }})

    });

    view.model.read();

    kendo.bind($("#mvvm"), view); 

  3. Kendo UI is VS 2017 Ready
  4. Luca
    Luca avatar
    11 posts
    Member since:
    Jul 2012

    Posted 30 Oct 2015 in reply to Luca Link to this post

    found the answer here: http://www.telerik.com/forums/clientside-mvvm-binding-from-mvc-jsonresult

     Don't know if this is the "best practice", but works fine for now

     Luca

  5. T. Tsonev
    Admin
    T. Tsonev avatar
    2772 posts

    Posted 03 Nov 2015 Link to this post

    Hello,

    Yes, the model should contain a data source instance named dsChart in order for this to work.
    This is what we'd recommend as well.

    Sorry for the delay!

    Regards,
    T. Tsonev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready