knockout.js Bindings - Form fields disabled / enabled


Example

The disabled binding adds a disabled attribute to a html element causing it to no longer be editable or clickable. This is useful mainly for <input>, <select>, <textarea>, <a> and <button> elements

<input data-bind="disabled: disableInput"/> 

<script type="text/javascript">
var viewModel = {
    disableInput: ko.observable(true);
};
</script>

The inverse of the disabled binding is enabled

The visibility can also be calculated using JavaScript functions. Any observables used in this functions have to called with parentheses

<script type="text/javascript">
var viewModel = {
    disableInput: ko.observable(true);
};
</script>

or

<input data-bind="disabled: allValues().length>4"/> 

<script type="text/javascript">
var viewModel = {
    allValues: ko.observableArray([1,2,3,4,5]);
};
</script>