Note that there are some explanatory texts on larger screens.

plurals
  1. POChange checkbox value on parent div click
    text
    copied!<p>I'm using knockout and trying to change the value of a checkbox when I click on the parent div. This works great but now I can't change the checkbox value when actually clicking on the checkbox...the span after the checkbox is for debugging purposes to see what the variable is set to. I tried using clickBubble: false but that didn't seem to help either.</p> <p>I have the following mapping:</p> <pre><code>var mapping = { 'teams': { create: function(options) { options.data.active=ko.observable(false); options.data.flipActive= function(team, event){ if(!$(event.target).hasClass('team_checkbox')) team.active(!team.active()); } return options.data; } } } </code></pre> <p>And the following HTML:</p> <pre><code> &lt;div id="selectTeamsArea" data-bind="foreach: teams"&gt; &lt;div class="teams_result_data" data-bind="click: flipActive, clickBubble: false"&gt; &lt;img class="floatLeft" height="40" width="40" data-bind="attr: {src: searchImgLink}" &gt; &lt;div&gt; &lt;p data-bind="text: searchBoldName"&gt;&lt;/p&gt; &lt;p data-bind="text: searchThirdLine"&gt;&lt;/p&gt; &lt;/div&gt; &lt;input class="right team_checkbox" type="checkbox" name="teams" data-bind="value: idString, checked: active, clickBubble: false" /&gt; &lt;span data-bind="text: active"&gt;&lt;/span&gt; &lt;/div&gt; &lt;div class="clear"&gt;&lt;/div&gt; &lt;/div&gt; </code></pre> <p>Any help is greatly appreciated.</p> <p><strong>UPDATE, INCLUDED JSFIDDLE: <a href="http://jsfiddle.net/YYUed/" rel="nofollow">http://jsfiddle.net/YYUed/</a></strong></p> <p>^Even if you comment out the innards of the "flipActive" the checkbox doesn't work right.</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