How to load kendo observable data array from MVC controller?

Question

I have the following kendo observable object:

var observable = kendo.observable({
    people: [
        { name: "John Doe" },
        { name: "Jane Doe" },
        { name: "Jimmy Doe" }
    ],
    products: [
        { name: "Table" },
        { name: "Chair" },
        { name: "Tomato" }
    ],
    animals: [
        { name: "Dog" },
        { name: "Cat" },
        { name: "Monkey" }
    ]
});

Can i make the inner collections load Json data directly from seperate controllers?

Answer 1

Yes. You need to create a controller that returns a Json result. Make an ajax call to the controllers route and stuff the response into a variable. Then refer to that in your observable. It might look something like this on the front end:

$.ajax("mysite/getstuff").done(
    function(data){
       var observable = kendo.observable(data);
    });

In this case the getstuff method on the controller needs to return a JSON object containing all of the properties and arrays you need like this:

{
    people: [array of people],
    products: [array of products],
    animals: [array pf animals] //etc
}