Question

I’d like to disable a button in a form until a checkbox is checked. I was looking at the Knockout attr binding, but it only controls the value of an attribute on an element, not whether or not that attribute should be attached to an element.

Here’s what I tried that doesn’t seem to work:

<a href=#" data-bind="attr: $root.isChecked() ? {} : { 'disabled' : 'disabled' }">Save Changes</a>

Any ideas?

Answer 1

You would want to bind your checkbox using the checked binding against a boolean on your view model, then you would use either the enable or disable binding on your button.

http://knockoutjs.com/documentation/enable-binding.html

Sample here: http://jsfiddle.net/rniemeyer/M6BzW/