Databases
StackOverflow2013
Postsdbo
PObootstrap check/uncheck multiple elements with js
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PObootstrap check/uncheck multiple elements with js
    text
    copied!<p>I am trying to make this work but can't make it happen. I have a bootstrap template and i want to check and uncheck multiple checkboxes (like this: <a href="http://jsfiddle.net/v6wmV/177/" rel="nofollow">http://jsfiddle.net/v6wmV/177/</a> ) I know this is a common subject with many solutions, but none seem to work for this case and i would like to know why.</p> <p><strong>This is the code snippet from the view:</strong></p> <pre><code>&lt;div class="hide" id="states"&gt; &lt;div class="control-group"&gt; &lt;label class="control-label"&gt;Select&lt;/label&gt; &lt;div class="check"&gt; &lt;div class="controls"&gt; &lt;label class="checkbox line"&gt; &lt;input type="checkbox" class="all" value="Todas" id="allstates" name="st[25]"/&gt;All &lt;/label&gt; &lt;label class="checkbox line"&gt; &lt;input type="checkbox" value="Caba" id="" name="st[1]"/&gt;Ciudad Autónoma de Buenos Aires &lt;/label&gt; &lt;label class="checkbox line"&gt; &lt;input type="checkbox" value="Buenos Aires" id="" name="st[2]"/&gt; Buenos Aires &lt;/label&gt; &lt;label class="checkbox line"&gt; &lt;input type="checkbox" value="Catamarca" id="" name="st[3]"/&gt; Catamarca &lt;/label&gt; &lt;label class="checkbox line"&gt; &lt;input type="checkbox" value="Chaco" id="" name="st[4]"/&gt; Chaco &lt;/label&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p><strong>and this is my js file (with other functions):</strong></p> <pre><code>$('.hide').hide(); $('#registered').click(function(){ $('#content').toggle('fast'); }); $('#age').click(function () { $('#content2').hide('fast'); $('#content1').show('fast'); }); $('#range').click(function () { $('#content1').hide('fast'); $('#content2').show('fast'); }); $('#with').click(function(){ $('#child').toggle('fast'); }); $('#showstates').click(function(){ $('#states').show('fast'); }); $('#hidestates').click(function(){ $('#states').hide('fast'); }); //function for check/uncheck $('.all').click(function() { var $checkboxes = $(this).parent().find('input[type=checkbox]'); $checkboxes.prop('checked', $(this).is(':checked')); }); </code></pre> <p>this is the fiddle: <a href="http://jsfiddle.net/jimena/j56Dy/" rel="nofollow">http://jsfiddle.net/jimena/j56Dy/</a> which is not working</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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