我有很多表从数据库中获取并向用户显示。这是我的示例表看起来像。 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
答案 0 :(得分:3)
您可以使用更改事件处理程序,该处理程序将侦听每个表的最后一个tr中的复选框的更改事件,然后将该表中所有复选框元素的已检查状态设置为已更改复选框的状态
//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