Question

I was wondering whether anyone had any recommendations regarding populating multiple view models on a screen. I have:

a) a view model that has a list of tasks

b) a view model that has a list of users

I populate these in the 2 x ajax success (separate ajax calls) something like:

success: function (data) {
    masterVM.User = ko.mapping.fromJS(data, mapping);
    ko.applyBindings(masterVM); 
}

/* another ajax call: */
success: function (data) {
    masterVM.Task = ko.mapping.fromJS(data, mapping);
    ko.applyBindings(masterVM); 
}

And currently calling in each ajax success call.

I hope my question is clear and concise. Please ask for further detail if required.

Regards
Phil

Answer 1

We currently handle this by sending all of the data to our page in a single Ajax call, then applying a ko.mapping to map the data to the view models on our main view model.

We began by making two calls just as you are but decided that it would be better to reduce the number of http requests being made, which is why we combined the data sets into a single hierarchical object structure, and it’s working great.

This question and the subsequent answer contain a snippet of the approach we’re taking:
Map JSON data to Knockout observableArray with specific view model type