I have a puted property on my model which is just splitting a ma separated string into an array, and I want to be able to utilize the "checked" binding's special array feature to write changes back through the puted property.

Everything works great for reading the puted property, but as soon as I check one of the checkboxes I get errors about some function not supporting splice (if I uncheck) or not supporting push (if I check).

> Uncaught TypeError: Object function
> h(){if(0<arguments.length)return"function"===typeof
> v?v.apply(d,arguments):j(Error("Cannot write a value to a koputed
> unless you specify a 'write' option. If you wish to read the current
> value, don't pass any parameters.")),this;n||g();b.r.Wa(h);return l}
> has no method 'splice' knockout-min.js:60 (anonymous function)

I created a quick sample on jsfiddle to illustrate what's going on. /

var MyModel = function() {
    this.src = ko.observable("one,two");
    thisp = koputed({
        read: function() {
            return (this.src() || "").split(",");
        },
        write: function(value) {
            var csvs = (value || []).join(",");
            this.src(csvs);
        },
        owner: this
    });
};

var model = new MyModel();
ko.applyBindings(model);

It never calls my write function. It seems like it's crashing in the binding. What am I doing wrong?

I have a puted property on my model which is just splitting a ma separated string into an array, and I want to be able to utilize the "checked" binding's special array feature to write changes back through the puted property.

Everything works great for reading the puted property, but as soon as I check one of the checkboxes I get errors about some function not supporting splice (if I uncheck) or not supporting push (if I check).

> Uncaught TypeError: Object function
> h(){if(0<arguments.length)return"function"===typeof
> v?v.apply(d,arguments):j(Error("Cannot write a value to a ko.puted
> unless you specify a 'write' option. If you wish to read the current
> value, don't pass any parameters.")),this;n||g();b.r.Wa(h);return l}
> has no method 'splice' knockout-min.js:60 (anonymous function)

I created a quick sample on jsfiddle to illustrate what's going on. http://jsfiddle/Y6tXw/

var MyModel = function() {
    this.src = ko.observable("one,two");
    this.p = ko.puted({
        read: function() {
            return (this.src() || "").split(",");
        },
        write: function(value) {
            var csvs = (value || []).join(",");
            this.src(csvs);
        },
        owner: this
    });
};

var model = new MyModel();
ko.applyBindings(model);

It never calls my write function. It seems like it's crashing in the binding. What am I doing wrong?

• javascript
• knockout.js

2 Answers 2

p in the above case in an puted, not an array. I have modified your code. I have used subscribe to listen to change notifications raised by p and re-calculate the value of sec

<input type="checkbox" value="one" data-bind="{ checked: p }"/>
<input type="checkbox" value="two" data-bind="{ checked: p }"/>
<input type="checkbox" value="three" data-bind="{ checked: p }"/>
<input type="text" data-bind="{ value: src }"/>


var MyModel = function () {

    var self = this;

    self.src = ko.observable("one,two");

    self.p = ko.observableArray((self.src() || "").split(","));

    self.p.subscribe(function () {
        self.src(ko.utils.unwrapObservable(self.p).join(","));
    });
};

$(function () {
    var model = new MyModel();
    ko.applyBindings(model);
})

Knockout assumes what you bind to is an observable array. I don't think they intended to support this option. (not yet at least) To get around that, it would be easier to go the other way instead. Make the array the array, and the src puted instead.

function ViewModel(data) {
    this.p = ko.observableArray(["one","two"]);
    this.src = ko.puted({
        read: function () {
            return this.p().join(",");
        },
        write: function (value) {
            this.p(value.split(","));
        },
        owner: this
    });
}