javascript - How to preselect Section in knockout-postbox.js so that the content is visible -


after looking ryan niemeyer's brilliant knockout-postbox.js made minor adapting , want menu open preselected section. hence added variable initialization of selectedsection observable seen below.

var menumodel = function() {      var preselected = "profile";     this.name = ko.observable().subscribeto("nickname");     this.sections = ["profile", "notifications","users","projects"];     this.selectedsection = ko.observable(preselected).publishon("section"); }; 

this selects desirable section, contents of section remains invisible.

here's preselected sections viewmodel:

var profilemodel = function() {     //apply filter turn value receive boolean     this.visible = ko.observable().subscribeto("section", function(newvalue) {         return newvalue === "profile";     });     //some more code - syncing , subscribing/publishing observables. }; 

the html goes this:

<div id="menu">     <h2><span data-bind="text: name"></span>'s settings</h2>     <ul class="nav nav-pills" data-bind="foreach: sections">         <li data-bind="css: { active: $root.selectedsection() === $data }">             <a href="#self" data-bind="text: $data, click: $root.selectedsection"></a>         </li>     </ul> </div>   <div id="profile" data-bind="visible: visible">     <h3>profile</h3>     <label>nick name: <input id="nick" data-bind="value: nickname" /> </label>     <label>email: <input data-bind="value: emailaddress" /></label> </div> 

the question is, how can trigger visible observable of profilemodel preselected setting of menumodel's selectedsection observable, such contents shown?

full fiddle: http://jsfiddle.net/asleg/b6gwn6ak/

the subscribeto helper can take boolean second argument indicate want initialize using last published value. compare function can passed third arg. like:

//apply filter turn value receive boolean this.visible = ko.observable().subscribeto("section", true, function(newvalue) {     return newvalue === "profile"; }); 

Comments

Popular posts from this blog

css - SVG using textPath a symbol not rendering in Firefox -

Java 8 + Maven Javadoc plugin: Error fetching URL -

node.js - How to abort query on demand using Neo4j drivers -