Implementing checkbox header - php

Question

I have a code which retrieves data from db and show it to a table. It is working fine but I want to implement a checkbox as part of the header which would allow me to select/deselect all rows. The header is just being pulled from db comments so I have no idea on how to implement the checkbox-select/deselect all header.
Here is my code,
<div>
<form action="test4.php" method="post"><?php
if(is_array($result)){
echo '
<fieldset>
<legend>Assign</legend>
<div>Changes will affect selected rows only.</div>
<table width=auto cellpadding=1px cellspacing=0px border=1 align=center>
<thead>
<tr>';
// column comment from DB as column header
foreach($result[0] as $key => $val){
echo '<th>'.$colcomments[$key].'</th>';
}
echo '
</tr>
</thead>
<tbody>';
foreach($result as $row => $info){
echo '
<tr>';
foreach($info as $key => $val){
if($key=='id'){
echo '
<td title="'.$colcomments[$key].'">'.$val.'.
<input type="checkbox" name="'.$key.'['.$info['id'].']"
value="'.$val.'" id="rowid_'.$val.'" />
<label for="rowid_'.$val.'"></label></td>';
}
else {
echo '
<td title="'.$colcomments[$key].'">
<input type="text" name="'.$key.'['.$info['id'].']"
value="'.$val.'" />
</td>';
}
}
echo '
</tr>';
}
echo '
</tbody>
</table>
</fieldset>';
}
?>
<fieldset>
<legend>Select Date</legend>
<div>Select Date from and Date to</div>
<input type="date" name="from" id="from" value="<?=$date['from']; ?>" />
<input type="date" name="to" id="to" value="<?=$date['to']; ?>" />
<div><input type="submit" value="Submit" /></div>
</fieldset>
</form>
</div>
This is the my script for the checkbox, and I dont know where I can insert a code to create a checkbox header. This is different from the ones posted previously as my issue is how I can create a checkbox header, if i only used the commments section in my db to make it as the header.
<script>
jQuery(document).ready(function () {
jQuery("input[name=checkall]").click(function () {
jQuery('input[name=checkall]').prop('checked', this.checked);
jQuery('input[name=checkbox]').prop('checked', this.checked);
});
// if all checkbox are selected, check the selectall checkbox
// and viceversa
jQuery("input[name=checkbox]").click(function(){
if(jQuery("input[name=checkbox]").length == jQuery("input[name=checkbox]:checked").length) {
jQuery("input[name=checkall]").prop("checked", true);
} else {
jQuery("input[name=checkall]").prop("checked", false);
}
});
});
</script>

Answer 1

I'm marking this as resolved. Easy fix is just to set the type to hidden.
Change from
<input type="checkbox" name="'.$key.'['.$info['id'].']"
To
<input type="hidden" name="'.$key.'['.$info['id'].']"
Checkbox is just a redundant since I need to update all rows anyways.