为什么我的checkall功能不起作用?

时间:2014-04-11 13:07:32

标签: javascript php jquery

我正在使用php,jquery和html使用MVC。在我的视图页面中,我有代码调用一个函数,该函数根据某些参数创建一个复选框列表,以及一个javascript函数,该函数在调用函数时检查所有框,并且用户检查了所有按钮。 下面的部分使用id或ward调用函数。

 <?=form_label('Wards  : ')?> <span id="wards"></span>

下面的部分执行checkall框。

$('#checkall').change(function(){

    if($(this).prop('checked')){
     //uncheck all the checkboxes   
     $("input.w:checkbox").each( 
       function() { 
          $(this).prop('checked',true);
       } 
     );
   }else{
      //check all the checkboxes  
      $("input.w:checkbox").each( 
       function() { 
          $(this).prop('checked',false);
       } 
     ); 
   }
});

这是生成复选框的Ward函数。

public function wards(){
        $id = $this->input->post('id');

        $this->db->join('building', 'building.id = ward.building_id');
        $this->db->select('ward.*, building.name as building_name');
        $this->db->where_in('ward.building_id', explode(',',$id));
        $sql = $this->db->get('ward');  
        $wards = $sql->result();

        $editid = $this->uri->segment(3);

        $this->db->select('wards');
        $userwards = $this->db->get_where('users', array('id'=>$editid))->result();

        $userwards = explode(',', $userwards[0]->wards);
        $data = array('name'=> 'wards[]', 'id'=> 'checkall', 'value' => 'All Observations','style'  => 'float: left; margin-right: 10px'); 
        if(!empty($wards)){
        echo form_checkbox($data).' '.form_label('All Wards');
            foreach($wards as $w){
                if(in_array($w->id, $userwards)){
                    $checked = 'TRUE';  
                } else { $checked = ''; }
                $warddata = array('name'=> 'wards[]', 'value' => $w->id, 'class' => 'w', 'checked'=> $checked, 'style'  => 'float: left; margin-right: 10px'); 
                echo                
                form_checkbox($warddata).' '.form_label($w->name.' ('.$w->building_name.')');   
            }
        }
        else { echo '<font color="#c00">No Wards are assigned to this building!</font>';}

    }

因此复选框按预期生成,但是当我检查所有病房复选框时,其他框不会被检查。我做错了什么?

1 个答案:

答案 0 :(得分:0)

以防万一你犯了最常见的jQuery错误:

您是否将jQuery包装在文档加载/就绪事件中?

旧语法为$(document).ready(function(){...});,但较新版本只是$(function(){...});

e.g。

$(function(){
    $('#checkall').change(function(){

        if($(this).prop('checked')){
         //uncheck all the checkboxes   
         $("input.w:checkbox").each( 
           function() { 
              $(this).prop('checked',true);
           } 
         );
       }else{
          //check all the checkboxes  
          $("input.w:checkbox").each( 
           function() { 
              $(this).prop('checked',false);
           } 
         ); 
       }
    });
});

如果不这样做,请检查您的代码是否使用alert

之类的简单内容解雇

e.g。

    $('#checkall').change(function(){
        alert("Yes, it fired!");   // Use liberally while developing :)        
        if($(this).prop('checked')){

如果不这样做,请尝试在打开F12调试窗口的情况下在Google Chrome中查看您的页面。

它将列出找到的所有Javascript / jQuery错误,您可以断点代码,查看变量内容等。

由于PHP几乎是一种只写语言,这样的问题需要显示它生成的HTML输出,最好是在带有jQuery的JSFiddle中。