为每个表选中复选框

Question

I have a lot of tables which I get from my database and show it to users. Here is my sample table look likes. Sample here. Once user checked each table bottom right check box, the whole check box for that table will be checked.

PHP function to call each table from database

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();

}

Here is the sample result that I want. JSFiddle
Source from : Stackoverflow

Answer 1

You can use a change event handler which will listen to the change event of the checkbox in the last tr of each table then set the checked status for all the checkbox elements in that table to the state of the changed 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)
})

Demo: Fiddle