Установите флажок для каждой таблицы

Question

У меня есть много таблиц, которые я получаю из своей базы данных и показываю их пользователям. Вот мой пример таблицы выглядит нравится. Sample here. После того, как пользователь установит флажок в правой нижней части таблицы, будет установлен флажок для этой таблицы.

PHP функция для вызова каждой таблицы из базы данных

function base_generateGroupRulechecklist($gid) 
{ 
    //connect to database 
    base_connectDatabase(); 

    $count = 0; 

    //get base_modules id 

     $getParentModuleSQL = base_executeSQL("SELECT * FROM base_parent_modules ORDER BY base_pmod_sort_by"); 
     $count1 = base_num_rows($getParentModuleSQL); 
     while($ParentModuledata_row = base_fetch_array($getParentModuleSQL)) 
     if ($count1!= 0) 
     { 
      //show category 
       echo "<table style=\"border-collapse: collapse\" width=\"100%\" class=\"permission\">"; 
       echo "<tr>"; 
       echo  "<th class=\"centerText\">".$ParentModuledata_row['base_pmod_name']."</th>"; 
       echo  "<th align=\"center\"><img src=\"". BASE_IMG_ICON_VIEW ."\" style=\"width:25px; height:25px\" title=\"View Permission\" /></th>"; 
       echo  "<th align=\"center\"><img src=\"". BASE_IMG_ICON_ADD ."\" style=\"width:25px; height:25px\" title=\"Add Permission\" /></th>"; 
       echo  "<th align=\"center\"><img src=\"". BASE_IMG_ICON_EDIT ."\" style=\"width:25px; height:25px\" title=\"Update Permission\" /></th>"; 
       echo  "<th align=\"center\"><img src=\"". BASE_IMG_ICON_DELETE ."\" style=\"width:25px; height:25px\" title=\"Delete Permission\" /></th>"; 
       echo "</tr>"; 

       $getModuleSQL = base_executeSQL("SELECT * FROM base_modules, base_group_details WHERE base_mod_parent = ".$ParentModuledata_row['base_pmod_id']." AND base_gpd_gp = ".$gid." AND base_gpd_mod = base_mod_id ORDER BY base_mod_sort_by"); 
       while($Moduledata_row = base_fetch_array($getModuleSQL)) 
       if (base_num_rows($getModuleSQL)!= 0) 
       { 
        if ($Moduledata_row["base_gpd_rule_view"] == "on") 
        { 
         $view = "checked"; 
        }else 
        { 
         $view = ""; 
        } 

        if ($Moduledata_row["base_gpd_rule_add"] == "on") 
        { 
         $add = "checked"; 
        }else 
        { 
         $add = ""; 
        } 

        if ($Moduledata_row["base_gpd_rule_edit"] == "on") 
        { 
         $edit = "checked"; 
        }else 
        { 
         $edit = ""; 
        } 

        if ($Moduledata_row["base_gpd_rule_delete"] == "on") 
        { 
         $delete = "checked"; 
        }else 
        { 
         $delete = ""; 
        } 
        //show module 
        $count +=1; 
        echo "<tbody>"; 
        echo "<tr>"; 
        echo "<td>". $count .". ".$Moduledata_row['base_mod_name']."</td>"; 
        echo "<td align=\"center\"><input type=\"checkbox\" value=\"on\" name=\"gp_mod_1_".$Moduledata_row['base_mod_id']."\" ".$view." /></td>"; 
        echo "<td align=\"center\"><input type=\"checkbox\" value=\"on\" name=\"gp_mod_2_".$Moduledata_row['base_mod_id']."\" ".$add." /></td>"; 
        echo "<td align=\"center\"><input type=\"checkbox\" value=\"on\" name=\"gp_mod_3_".$Moduledata_row['base_mod_id']."\" ".$edit." /></td>"; 
        echo "<td align=\"center\"><input type=\"checkbox\" value=\"on\" name=\"gp_mod_4_".$Moduledata_row['base_mod_id']."\" ".$delete." /></td>"; 
        echo "</tr>"; 
       } 
       echo "<tr align='right'>"; 
       echo "<td colspan='5'><input type=\"checkbox\" id='allcb' name='allcb'/></td>"; 
       echo "</tr>"; 
       echo "</tbody>"; 
       echo "</table><br />";   
     } 

     return $count; 
    //close the database 
    base_closeDatabase(); 

} 

Вот пример результата, который я хочу. JSFiddle
Источника от: Stackoverflow

Answer 1

Вы можете использовать обработчик изменения событий, который будет прослушивать событие изменения от флажка в последном тре каждой таблицы установите проверенный статус для всех CheckBox элементов этой таблицы в состояние измененного флажком

//change event handler for the checkbox in the last tr 
$('table tr:last-child input:checkbox').change(function(){ 
    //use closest to find the table containing the changed checkbox and set the checked value for each checkbox in that table to the new status 
    $(this).closest('table').find('input:checkbox').prop('checked', this.checked) 
}) 

Демо: Fiddle