Databases
StackOverflow2013
Postsdbo
PO"select all" check box not working
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO"select all" check box not working
    text
    copied!<p>I am trying to create domain search form. There will be check boxes with individual domain names as well as a select all or search all check box. When clicked on it all the other checkboxes should get selected and on unchecking it all the other check boxes should get unchecked too. Now here is the script i am trying to use but for some reason it wont work</p> <p>Script</p> <pre><code>&lt;script type='text/javascript' src='http://code.jquery.com/jquery-1.5.2.js'&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt;//&lt;![CDATA[ $(window).load(function(){ $("#checkAll").change(function() { $(":checkbox").attr("checked", this.checked); }); $(".others").change(function() { if (!$('input.others[type=checkbox]:not(:checked)').length) $("#checkAll").attr('checked', true); if (!$('input.others[type=checkbox]:checked').length) $("#checkAll").attr('checked', false); }); });//]]&gt; </code></pre> <p></p> <p>HTML Part</p> <pre><code>&lt;div class="tran_form"&gt; &lt;form id="form3" action="whmcs/cart.php?a=add&amp;domain=register" method="post"&gt; &lt;input type="hidden" name="token" value="52fe670c7c55b28b9e76c677afd97580147cbb5e" /&gt; &lt;fieldset class="d-block"&gt; &lt;div class="margin-bot"&gt; &lt;div class="inp_title"&gt;www.&lt;/div&gt; &lt;label class="input-1"&gt; &lt;input type="text" name="sld"&gt; &lt;/label&gt; &lt;a href="#" class="button-2" onClick="document.getElementById('form3').submit()"&gt;Search Now!&lt;/a&gt; &lt;div class="clear"&gt;&lt;/div&gt; &lt;/div&gt; &lt;div class="wrapper"&gt; &lt;div class="col-1"&gt; &lt;input type="checkbox" name="tlds[]" value=".in" class="others"&gt; &lt;label&gt;.in&lt;/label&gt; &lt;/div&gt; &lt;div class="col-1"&gt; &lt;input type="checkbox" name="tlds[]" value=".com" class="others"&gt; &lt;label&gt;.com&lt;/label&gt; &lt;/div&gt; &lt;div class="col-1"&gt; &lt;input type="checkbox" name="tlds[]" value=".net" class="others"&gt; &lt;label&gt;.net&lt;/label&gt; &lt;/div&gt; &lt;div class="col-1"&gt; &lt;input type="checkbox" name="tlds[]" value=".org" class="others"&gt; &lt;label&gt;.org&lt;/label&gt; &lt;/div&gt; &lt;div class="col-1"&gt; &lt;input type="checkbox" name="tlds[]" value=".biz" class="others"&gt; &lt;label&gt;.biz&lt;/label&gt; &lt;/div&gt; &lt;div class="col-1"&gt; &lt;input type="checkbox" name="tlds[]" value=".info" class="others"&gt; &lt;label&gt;.info&lt;/label&gt; &lt;/div&gt; &lt;div class="col-1"&gt; &lt;input type="checkbox" id="checkAll"&gt; &lt;label class="reg2 color-1"&gt;Search All&lt;/label&gt; &lt;/div&gt; &lt;/div&gt; &lt;/fieldset&gt; &lt;/form&gt; &lt;/div&gt; </code></pre> <p>Any idea what i am doing wrong? doesn't seem to work. When I am using a toned down version of this script as shown below</p> <pre><code>&lt;html&gt; &lt;head&gt; &lt;link rel="stylesheet" type="text/css" href="style.css"&gt; &lt;script type='text/javascript' src='http://code.jquery.com/jquery-1.5.2.js'&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt;//&lt;![CDATA[ $(window).load(function(){ $("#checkAll").change(function() { $(":checkbox").attr("checked", this.checked); }); $(".others").change(function() { if (!$('input.others[type=checkbox]:not(:checked)').length) $("#checkAll").attr('checked', true); if (!$('input.others[type=checkbox]:checked').length) $("#checkAll").attr('checked', false); }); });//]]&gt; &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div&gt; &lt;input type="checkbox" value="" id="checkAll"&gt; &lt;input type="checkbox" value="a" class="others"&gt; &lt;input type="checkbox" value="b" class="others"&gt; &lt;input type="checkbox" value="c" class="others"&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>The select all is working just fine but when i try to adopt it into the site i am working on it wont work. </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