title: Bootstrap Switch, global checkbox to (un)check all other
body: <p>I am using Bootstrap Switch for Twitter Bootstrap. Here I have problem to check or uncheck all checkbox based on global checkbox checked or unchecked</p>
  
  <p>Here is the bootstrap switch link <a href="http://www.bootstrap-switch.org/">http://www.bootstrap-switch.org/</a></p>
  
  <p>Here is what I have done</p>
  
  <pre><code>&lt;!-- this is the global checkbox --&gt;
  &lt;div class="make-switch switch-mini"&gt;
      &lt;input type="checkbox" id="rowSelectAll"&gt;
  &lt;/div&gt;
  
  &lt;!-- row checkboxs --&gt;
  &lt;div class="make-switch switch-mini"&gt;
      &lt;input type="checkbox" class="row-select"&gt;
  &lt;/div&gt;
  &lt;div class="make-switch switch-mini"&gt;
      &lt;input type="checkbox" class="row-select"&gt;
  &lt;/div&gt;
  &lt;div class="make-switch switch-mini"&gt;
      &lt;input type="checkbox" class="row-select"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>$("#rowSelectAll").click(function () {
      $(".row-select").prop('checked', $(this).prop('checked'));
  });
  </code></pre>
  
  <p>EDIT: tried with only one global and one local checkbox</p>
  
  <pre><code>&lt;div class="make-switch switch-mini"&gt;
      &lt;input type="checkbox" id="rowSelectAll"&gt;
  &lt;/div&gt;
  
  &lt;div id="toggle-state-switch" class="make-switch switch-mini row-select"&gt;
      &lt;input type="checkbox" class=""&gt;
  &lt;/div&gt;
  </code></pre>