Clever Geek Handbook

Jquery uniform select and uncheck box

I have a problem with the select all / deselect checkbox

Code here

<input type="checkbox" value="" onclick="checkedAll();" name="checkall" id="checkall"/>

  function checkedAll() {
      $('.all span').click(function () {
       if(document.getElementById("checkall").checked == true)
       {
         $('#uniform-undefined span').addClass('checked');      
       }
       else
       {
         $('#uniform-undefined span').removeClass('checked');
       }
     });
     $.uniform.update();
   }

When I check the checkbox (for all checkboxes true) jQuery adds a span tag with class="checked" 

     spanTag.addClass(options.checkedClass);

And no one is installed.

<li><label><div id="uniform-undefined" class="checker">">
   <span class="checked"><input type="checkbox" value="F2" style="opacity: 0;"></span>
   </div><b>1 </b>
 </label></li>

<li><label><div id="uniform-undefined" class="checker">
   <span class="checked"><input type="checkbox" value="F2" style="opacity: 0;"></span>
   </div><b>2 </b>
</label></li>

<li><label><div id="uniform-undefined" class="checker">
    <span class="checked"><input type="checkbox" value="F3" style="opacity: 0;"></span>
    </div><b>3 </b>
</label></li>
+3


source to share


5 answers


Are you striving for something like this?

$('document').ready(function(){
    $('#all').click(function(){
        if($(this).is(':checked')){
            $('.group').attr("checked",true);
        }
        else{
            $('.group').attr("checked",false);
        }
    })
});


See Demo

+2


source


Try it...

  $('#all').on('click', function(){
        $(':checkbox').attr("checked",$(this).is(':checked'));
  });

OR for the las version.



  $('#all').on('click', function(){
        $(':checkbox').prop("checked",$(this).is(':checked'));
  });

See Example ...

+3


source 


$('document').ready(function(){
    $('#all').click(function(){
        if($(this).is(':checked')){
            $('.group').attr("checked",true);
        }
        else{
            $('.group').attr("checked",false);
        }
    })
});

this code only works correctly the first time. The second time, if I click the Check All button, it doesn't work. It has just been tested.

0


source


The simplest solution call uniform.update:

        $(".all span").each(function () {
            $(this).prop("checked", document.getElementById("checkall").checked );
        });
        $.uniform.update();
0


source 


<script>
$('document').ready(function(){

    $('#selectAll').click(function(){
        if($(this).is(':checked')){
            $('#uniform-undefined span').attr("class","checked");
        }
        else{
            $('#uniform-undefined span').attr("class","");
        }
    })
});
</script>
-2


source






More articles:


All Articles