title: Knockout binding for Bootstrap toggle buttons
body: <p>I'm looking for a way in KnockoutJS to bind toggle button to a function that gets called when a specific value (button) is selected.</p>
  
  <p>I tried several solutions and got it running with just KnockoutJS, but when I add Boostrap to it, it still doesn't work.</p>
  
  <p>My code shown here does not trigger the handler function associated with <code>checked</code> event. For the latest working example, use the JSFiddle.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="access-rights-control" class="btn-group pull-right" data-toggle="buttons"&gt;
    &lt;label class="btn btn-xs"&gt;
      &lt;input type="radio" name="status" value="1" id="status-published" data-bind="checked: $root.allowAccessHandler" /&gt;Allow access
    &lt;/label&gt;
    &lt;label class="btn btn-xs active"&gt;
      &lt;input type="radio" name="status" value="0" id="status-draft" checked /&gt; No change
    &lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>var viewModel = function() {
    this.allowAccessHandler = function() {
      alert("Works!");
    }
  };
  ko.applyBindings(new viewModel());
  </code></pre>
  
  <p>JSFiddle:
  <a href="http://jsfiddle.net/p8nSe/191/" rel="nofollow">http://jsfiddle.net/p8nSe/191/</a></p>