2016-02-19 27 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

相關問題