Stack Overflow 13210275

http://stackoverflow.com/questions/13210275/knockoutjs-computed-passing-parameters

HTML

<script src="https://github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.debug.js"></script>
<script src="https://github.com/downloads/rniemeyer/knockout-postbox/knockout-postbox.js"></script>
<script src="https://github.com/downloads/ericmbarnard/Knockout-Validation/knockout.validation.v0.9.js"></script>
<div id="view1">
<ul>
    <li><label>Checkbox 0x1<input type="checkbox" data-bind="checked: flag(0x1)"/></label></li>
    <li><label>Checkbox 0x2<input type="checkbox" data-bind="checked: flag(0x2)"/></label></li>
    <li><label>Checkbox 0x4<input type="checkbox" data-bind="checked: flag(0x4)"/></label></li>
    <li><label>Checkbox 0x8<input type="checkbox" data-bind="checked: flag(0x8)"/></label></li>
</ul>
<div data-bind="text: flags"></div>
</div>

<hr>

<div id="view2">
<ul>
    <li><label>Checkbox 1<input type="checkbox" data-bind="checked: checkedValues, value: 1"/></label></li>
    <li><label>Checkbox 2<input type="checkbox" data-bind="checked: checkedValues, value: 2"/></label></li>
    <li><label>Checkbox 3<input type="checkbox" data-bind="checked: checkedValues, value: 3"/></label></li>
    <li><label>Checkbox 4<input type="checkbox" data-bind="checked: checkedValues, value: 4"/></label></li>
</ul>
<div data-bind="text: ko.toJSON(checkedValues)"></div>
</div>

JavaScript

function ViewModel1() {
    this.flags = ko.observable(0);
    
    this.flag = function (flagValue) {
        return ko.computed({
            read: function () {
                return !!(this.flags() & flagValue);
            },
            write: function (checked) {
                if (checked)
                    this.flags(this.flags() | flagValue);
                else
                    this.flags(this.flags() & ~flagValue);
            }
        }, this);
    };
}
ko.applyBindings(new ViewModel1, document.getElementById('view1'));

function ViewModel2() {
    this.checkedValues = ko.observableArray([]);
};
ko.applyBindings(new ViewModel2, document.getElementById('view2'));