knockout.js - knockout foreach binding not working when viewmodel used as a sub-view-model wizard style dialog -


i creating wizard consists of multiple sub-view-models.

one view-model (step 3) copy of knockout form , consists of 2 radio button groups, first group controls options available in second group.

i having trouble binding radio buttons when used in sub-view, whilst works standalone view-model, seems when used sub-view self.availabledatabases ko.computed function never called (or in other words, seems view not bound viewmodel).

the select db radio group bound child's view model availabledatabases below code:

<h1>select os:</h1> <div data-bind="foreach: os" >     <div>         <input type="radio" name="os" data-bind="attr: {value: name}, checked: $root.selectedos" />         <span data-bind="text: name"></span>     </div>     </div> <h1>select db:</h1> <div data-bind="foreach: availabledatabases" >     <div>         <input type="radio" name="db" data-bind="attr: {value: name}, checked: $root.selecteddb" />         <span data-bind="text: name"></span>     </div>     </div> 

the fiddle entire wizard code here, ideas doing wrong integration sub-view-model?

you need use $parent instead of $root.

the $root references main view model pass in applybindings call in case viewmodel have selectedos , selecteddb properties on configuremodel.

so need use $parent "go 1 level up" in foreach access properties (or use $root.configuremodel().selectedos go way top , go 1 level down configuremodel)

<h1>select os:</h1> <div data-bind="foreach: os" >     <div>         <input type="radio" name="os" data-bind="attr: {value: name},                 checked: $parent.selectedos" />         <span data-bind="text: name"></span>     </div>     </div> <h1>select db:</h1> <div data-bind="foreach: availabledatabases" >     <div>         <input type="radio" name="db" data-bind="attr: {value: name},                 checked: $parent.selecteddb" />         <span data-bind="text: name"></span>     </div>     </div> 

demo jsfiddle.

you can read these binding context properties in documentation.


Comments

Popular posts from this blog

php - Calling a template part from a post -

Firefox SVG shape not printing when it has stroke -

How to mention the localhost in android -