2016-02-19 28 views
1

我想让复选框检查所有的子复选框。为什么我的复选框不起作用?我正在使用codeigniter,这里是我的视图

我的复选框:

<table width="30%" class="table striped hovered cell-hovered border bordered"> 
      <tr valign="middle"> 
       <td><b>IDPEL</b></td> 
       <td><b>No. Baris</b></td> 
       <td><b><input type="checkbox" id="pilihsemua"/> Pilih Semua</b></td> 

      </tr> 
      <?php 

       foreach ($panel_error as $key) { 



        echo"<tr><td>".$key->errpanel."</td>"; 
        echo"<td>".$key->nomorBaris."</td>"; 
        echo"<td>"; 
        echo form_checkbox('chk_boxes1[]',$key->errpanel); 
        echo"</td></tr>"; 

       } 


      ?> 
     </table> 

,这里是我的脚本:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.chk_boxes').click(function(){ 
      $('.chk_boxes1').attr('checked',checked) 
     }) 

     $('#table1').dataTable(); 
     $('#table2').dataTable(); 

     //checkbox 
     $("#pilihsemua").click(function() { // If #pilihsemua checked, all checkbox will be checked. 
      $('.chk_boxes1[]').attr('checked', checked); 
     }); 
     // if all sub checkboxes are being checked, #pilihsemua will automatically checked. 
     $(".chk_boxes1[]").click(function(){ 

      if($(".chk_boxes1[]").length == $(".chk_boxes1[]:checked").length) { 
       $("#pilihsemua").attr("checked", "checked"); 
      } else { 
       $("#pilihsemua").removeAttr("checked"); 
      } 

     }); 
     //end of checkbox 
    }); 

</script> 

不过,我仍然不知道为什么,就不能工作。我尝试检查#pilihsemua但所有的子类不检查。或者如果我检查了所有的子类,#pilihsemuadoes不会被检查。

+1

类名不附带'[]'。你在jQuery中使用名字。 – Yash

+0

检查[这个小提琴](http://jsfiddle.net/NogginBox/ScnQT/1/)和[这个堆栈](http://stackoverflow.com/questions/18537609/jquery-checkbox-check-all)链接 – PHPExpert

+0

哇,真的有帮助!非常感谢! – Berlian

回答

0

也许它接近这个:

但是这个剧本有一些缺陷。正试图找出什么是错..

例子: HTML代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
<table width="30%" cellspacing="1" cellpadding="1" border="collapse"> 
      <tr> 
       <td><b><input type="checkbox" class="group" chk="g1"/> Pilih Semua</b></td> 
       <td><b><input type="checkbox" class="group" chk="g2"/> Pilih Semua</b></td> 
       <td><b><input type="checkbox" class="group" chk="g3"/> Pilih Semua</b></td> 
      </tr> 
      <tr> 
       <td> 
       <input type="checkbox" class="g1"/> 
       <input type="checkbox" class="g1"/> 
       <input type="checkbox" class="g1"/> 
       </td> 
       <td> 
       <input type="checkbox" class="g2"/> 
       <input type="checkbox" class="g2"/> 
       <input type="checkbox" class="g2"/> 
       </td> 
       <td> 
       <input type="checkbox" class="g3"/> 
       <input type="checkbox" class="g3"/> 
       <input type="checkbox" class="g3"/> 
       </td> 
      </tr> 

     </table> 

脚本: Jquery

$(function(){ 
    $(".group").click(function(){ 
    var click = $(this).attr('chk'); 
    var current = $("."+click).attr('checked'); 
    if(current){ 
      $("."+click).removeAttr('checked'); 
    }else{ 
     $("."+click).attr('checked','checked'); 
    } 
    }) 
}) 

check this out real simulation

相关问题