checkboxe enable/disable per row in knockoutjs

by Carolyn Marshall

HTML

<script src="http://knockoutjs.com/downloads/knockout-2.0.0.js"></script>
<ul data-bind="foreach: phones">
    <li>
        <input type='text' data-bind="value:phone, disable: $parent.checkForPhone($data)"/>
        <input type="checkbox" data-bind="value:id, checked: $root.selectedPhones" />
    </li>
</ul>

<hr/>
selected phones:
<div data-bind="text: ko.toJSON($root.selectedPhones)"></div>
<hr/>
phones:
<div data-bind="text: ko.toJSON($root.phones)"></div>

JavaScript

function Phone(id,phone) {
    this.id = id;
    this.phone = phone;
}

var phones_list = [
    new Phone(1, '11111'),
    new Phone(2, '22222'),
    new Phone(3, '33333')
];

var viewModel = {
    phones: ko.observableArray(phones_list),
    selectedPhones: ko.observableArray(),
    checkForPhone: function (phone) {
    		alert(phone.phone);
        console.log('checking for phone', phone);
        return this.selectedPhones().indexOf(phone.id) === -1;
    }
};
    
ko.applyBindings(viewModel);