CODEWITHSUNDEEP
knockout.js
twaldron
twaldron

Reputation: 2752

knockout computed array not updating when function updates observable array used in computed

I have the following computed observable witch basically divides the modelViewModels observableArray into another array to repsresent rows (logic isn't the issue though)

this is being defined in the constructor

self.selectModelRows = ko.computed(function () {
    alert("computing");
    var result = [],
        row,
        colLength = parseInt(self.selectModelRowCount(), 10);

    for (var i = 0, j = self.modelViewModels.length; i < j; i++) {
        if (i % colLength === 0) {
            if (row) {
                result.push(row);
            }
            row = [];
        }
        row.push(self.modelViewModels()[i]);
    }

    if (row) {
        result.push(row);
    }
    return result
});

i put the alert there for debugging. the alert happens the first time when the constructor is run but i have the following function which updates the modelViewModels that is used in the computed 

self.getModels = function () {
    alert("getting");
    var self = this;
    self.modelViewModels([]);

    $.when(self.dataContext.getAvailableModels(self.selectedSeriesOption()))
        .done(function (data) {
            ko.utils.arrayForEach(data.Models, function (item) {
                var modelViewModel = new ModelViewModel();
                modelViewModel.Model = item.ModelNumber;
                   //more logic will be added
                self.modelViewModels.push(modelViewModel);
            });
        })
        .fail(function (message) {
            alert("failed");
        });
}

when the function is called i see the "getting" alert but the computed function is not called again, the "computing" alert never happens and there are no errors in console.

not sure what else i need to be doing to get the computed to update after the getModels function is called.

Upvotes: 0

Views: 292

Answers (1)

ebram khalil
ebram khalil

Reputation: 8321

Inside your computed function the for loop will not get called because you are getting array length in wrong way.

self.modelViewModels.length will always be evaluated to 0. So, the nothing inside the for will be executed and hence you are not reading any observable object, which result in no-dependency and no calling for that computed function.

Change your code to be self.modelViewModels().length. just add ()

Upvotes: 2

Related Questions