Question

I have something like the following:

var ChildViewModel = function (viewModel) {
    // state
    this.viewModel = viewModel;
    this.index = ko.dependentObservable(function () {
        return this.viewModel.selections().indexOf(this);
    }, this);
    this.remove = function () {
        this.viewModel.removeSelection(this);
    };
    this.moveUp = function () {
        this.move(-1);
    };
    this.moveDown = function () {
        this.move(1);
    };
    this.move = function (direction) {
        var i = this.index();
        this.remove();
        this.viewModel.selections.splice(i + direction, 0, this);
    };

    // additional properties

};

var viewModel = {
    selections: ko.observableArray(),
    removeSelection: function (item) {
        this.selections.remove(item);
    },
    addSelection: function (event) {
        var child = new ChildViewModel(this);
        this.selections.push(child );
    }
};

ko.applyBindings(viewModel);

When I call addSelection, I have get a Object doesn't support this property or method exception inside the KnockoutJS library. My application works fine in Firefox 3.6 and Chrome. I get the exception in IE8. I’m using version 2.0 1.3 Beta of KnockoutJS.

What am I doing wrong?

Answer 1

Ok i had 2 different problems.

First, I removed the method to get the value of the array, instead used the observable array.

 // Bad code for IE8
 this.viewModel.selections().indexOf(this);

 // this works
 this.viewModel.selections.indexOf(this);

Also, I was setting the for attribute. IE complains about that for is a keyword.

// Bad code for IE8
data-bind="attr: { for : logicalOperatorAndFieldId }"

// Good code for IE8
data-bind="attr: { 'for' : logicalOperatorAndFieldId }"