KO DropDown Binding

Data-binding options:

disabled

Example:
In this example, the ViewModel is defined specifically for use with the dropdown. If the value of a wijdropdown data-binding option changes, then the widgets will automatically respond. The widgets also update the ViewModel values as they modify them.

Create a ViewModel:

ViewModel Script	Copy Code
var viewModel = function () {this.check = ko.observable(true)};

Create View with Bound Controls:

View Markup	Copy Code
<h3>Dropdown with Optgroups</h3> <select id="select2" data-bind="wijdropdown: {}"> <optgroup label="A-G"> <option>A</option> <option selected="selected">B</option> <option>C</option> <option>D</option> <option>E</option> <option>F</option> <option>G</option> </optgroup> <optgroup label="H-M"> <option>H</option> <option>I</option> <option>J</option> <option>K</option> <option>L</option> <option>M</option> </optgroup> </select>

View Markup

Copy Code

<h3>Dropdown with Optgroups</h3> 
    <select id="select2" data-bind="wijdropdown: {}">     
     <optgroup label="A-G">         
           <option>A</option>
           <option selected="selected">B</option>
           <option>C</option>
           <option>D</option>
           <option>E</option>
           <option>F</option>
           <option>G</option>
     </optgroup>     
     <optgroup label="H-M">
           <option>H</option>
           <option>I</option>
           <option>J</option>
           <option>K</option>
           <option>L</option>
           <option>M</option>
           </optgroup>
      </select>

See Also

Concepts

Widgets

Reference