Skip to content Skip to sidebar Skip to footer

Select All Checkboxes With JQuery Not Working

I have this issue and can't figure out why my code isn't working. I want to select all checkboxes when clicking on 'Todas'. I made a fiddle with the code and it works there, but wh

Solution 1:

Solution was to find that "span" tag that another js file adds (I'm using a template based on bootstrap). So code that works is:

$('#allstates').click(function() {
  if($(this).attr("checked")){
    $('#states').find('span').addClass('checked');  
    $('#states').find('input').prop('checked',true);        
  }else{
    $('#states').find('span').removeClass('checked');
  }    
});

Solution 2:

Try something like the following:

<html>
<head>
    <script type="text/javascript" src="JQ.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#allstates').click(function() {
            var c = this.checked;
            $(":checkbox").prop("checked", c);
            });
        });
    </script>
</head>
<body>
    <div class="hide" id="states">
      <div class="control-group">                           
        <label class="control-label">Seleccione</label>
          <div class="controls">
            <label class="checkbox span4">
              <input type="checkbox" class="all" value="all" id="allstates" name="all"/>Todas
            </label>
            <label class="checkbox span4">
              <input type="checkbox" value="Caba" id="" name="st[]"/>Ciudad Autónoma de Buenos Aires
            </label>
            <label class="checkbox span4">
              <input type="checkbox" value="Buenos Aires" id="" name="st[]"/> Buenos Aires
            </label>
            <label class="checkbox span4">
              <input type="checkbox" value="Catamarca" id="" name="st[]"/> Catamarca
            </label>
            <label class="checkbox span4">
              <input type="checkbox" value="Chaco" id="" name="st[]"/> Chaco
            </label>
           </div>
      </div>
    </div>
</body>
</html>

JQ is a jQuery library (version 1.11.1).


Post a Comment for "Select All Checkboxes With JQuery Not Working"