Note that there are some explanatory texts on larger screens.

plurals
  1. POcollapsible menu using knockout and jquery
    text
    copied!<p>I am trying to build a simple collapsible menu using knockout and jquery. But for some reason jquery is not being activated.</p> <p>the script is located here <a href="http://jsfiddle.net/DXymk/" rel="nofollow noreferrer">jsfiddle</a></p> <pre><code> &lt;ul id="usernav" data-bind="template: { name: 'seasonTemplate', foreach: seasons, as: 'season' }"&gt;&lt;/ul&gt; &lt;script type="text/html" id="seasonTemplate"&gt; &lt;li&gt; &lt;strong data-bind="text: name"&gt;&lt;/strong&gt; &lt;ul data-bind="template: { name: 'monthTemplate', foreach: months, as: 'month' }"&gt;&lt;/ul&gt; &lt;/li&gt; &lt;/script&gt; &lt;script type="text/html" id="monthTemplate"&gt; &lt;li&gt; &lt;span data-bind="text: month"&gt;&lt;/span&gt; is in &lt;span data-bind="text: season.name"&gt;&lt;/span&gt; &lt;/li&gt; &lt;/script&gt; </code></pre> <p>the script is</p> <pre><code> var viewModel = { seasons: ko.observableArray([ { name: 'Spring', months:[ 'March' , 'April', 'May' ]}, { name: 'Summer', months: [ 'June', 'July', 'August' ] }, { name: 'Autumn', months: [ 'September', 'October', 'November' ] }, { name: 'Winter', months: [ 'December', 'January', 'February' ] } ]) }; ko.applyBindings(viewModel); $('#usernav').find('ul').hide(); $('li').click(function(e) { $(this).children('ul').toggle(); e.stopPropagation(); }); </code></pre> <p><strong>Edit:-</strong> So yes I may have forgotten to include the jquery library in the original jsfiddle post while copy pasting, but that is not my issue. I created a separate question regarding my issue <a href="https://stackoverflow.com/questions/19730723/jquery-eventbinding-in-collpasible-menu-while-using-knockout-template">here</a> Thanks!!</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload