it’s possible that the QRCodeStyling library may not be handling each iteration correctly because the variable $linkcert inside the JavaScript block is always resolving to the last value in the loop. what can I do here is the code thanks
P.S whenever I scan the QR Code only the data of the last iteration loop is displaying
<?php
session_start();
include("../../../connection.php");
$user = $_SESSION['user'];
$btn = $_GET['btn'];
$id_encrypt = $_GET['link'];
$link = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
include("../functions/control_query.php");
$decrypt = base64_decode(urldecode($id_encrypt));
$id=((($decrypt*54321)/12345)/6789);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport" shrink-to-fit=yes>
<!-- Header & Styles -->
<?php include('../link/header-sublink.php');?>
<style type="text/css">
table.report-container {
page-break-after:always;
}
thead.report-header {
display:table-header-group;
}
tfoot.report-footer {
display:table-footer-group;
}
@media print {
body{
width:100%;
height:auto;
overflow: hidden;
background-color:#fff;
}
.footer{
page-break-after:always;
}
@page {
height: 100%;
margin:0mm,0mm,0mm,0mm;
size: portrait;
background-color: #fff;
}
}
@media screen {
.print{display:none !important;}
}
</style>
</head>
<body onload="window.print(); window.focus()">
<?php
$reqtype = mysqli_query($req,"SELECT tbl_request.request_id, tbl_request.request_type FROM tbl_request WHERE tbl_request.request_id='$id'") or die (mysqli_connect_error());
$rqt = mysqli_fetch_array($reqtype,MYSQLI_ASSOC);
$request = $rqt['request_type'];
$cert_type = 'Certificate of Leave Credits Balance';
$division_type = 'Administrative Division';
$decrypt = base64_decode(urldecode($id_encrypt));
$id=((($decrypt*54321)/12345)/6789);
//details
$det = mysqli_query($req,"SELECT tbl_request.request_id, tbl_request.ctrl_no, tbl_request.`name`, tbl_request.position, tbl_request.place_assign, tbl_request.request_type, tbl_request.purpose, tbl_request.phone, tbl_request.requested_by, tbl_request.`status`, tbl_request.date_created, tbl_cert_leave.purpose, tbl_cert_leave.date_hired, tbl_cert_leave.vacation, tbl_cert_leave.sick, tbl_cert_leave.as_of_date, tbl_cert_leave.approve_by, tbl_cert_leave.date_created FROM tbl_request INNER JOIN tbl_cert_leave ON tbl_cert_leave.request_id = tbl_request.request_id WHERE tbl_request.request_type='Certificate of Leave Credits Balance' ") or die (mysqli_connect_error());
//initialize index to keep track of certificates
$index = 1;
while ($det1 = mysqli_fetch_array($det,MYSQLI_NUM)) {
if (empty($det1)) {
$det1 = NULL;
echo "<script>alert('Invalid URL');</script>";
header("Refresh:0; url=../error404?user=$user");
}
$qrDivId = "qrCodeDiv" . $index; //unique div ID for each QR Code
//convert date format
$originalDate = strtotime($det1[15]);
$asofDate = date("F j, Y", $originalDate);
$date1 = strtotime($det1[17]);
$day = date("jS", $date1);
$date2 = strtotime($det1[17]);
$month = date("F Y", $date2);
//Administrative Division Approval
$adm_u = mysqli_query($req,"SELECT ctrl_user.ctrl_id, ctrl_user.`user`, ctrl_user.admin_user, ctrl_user.processing_user, ctrl_user.approval_user, ctrl_user.approval_user_ard, ctrl_user.end_user, ctrl_user.cashier_user, user_details.division, user_details.`name`,user_details.position, user_details.place FROM ctrl_user INNER JOIN user_details ON user_details.user_id = ctrl_user.`user` where ctrl_user.approval_user = '1' and user_details.division = '$division_type' ORDER BY ctrl_user.ctrl_id DESC LIMIT 1 ") or die (mysqli_connect_error());
$adm_usr = mysqli_fetch_array($adm_u,MYSQLI_NUM);
//logs
$b = mysqli_query($req,"SELECT logs_approval.`user`, logs_approval.action_taken, logs_approval.date_action_taken, logs_approval.request_id FROM logs_approval WHERE logs_approval.request_id = '$id' and logs_approval.action_taken = 'Approved Request' and logs_approval.`user` = '$adm_usr[1]' ORDER BY logs_approval.date_action_taken DESC LIMIT 1 ") or die (mysqli_connect_error());
$bb = mysqli_fetch_array($b,MYSQLI_NUM);
//electronically signed & date
$digitally_signed_by = 'ELECTRONICALLY SIGNED BY:';
$chief_approval = strtoupper($adm_usr[9]);
$date_signed = date('D, M j, Y/ h:i a', strtotime($bb[2]));
$name = ucwords(strtolower($det1[3]));
$name1 = strtoupper($det1[2]);
// Dynamically generate the $linkcert using the request_id from $det1[0]
$linkcert = 'http://localhost/r9_iis/main/spics/certificates/view_certificate?link=' . urlencode($det1[0]);
echo"
<div class='print'>
<div class='col-md-6 override'>
<div class='card-body' style=' font-family: Times New Roman;'>
<!-- HEADER -->
<div class='row mt-2 align-items-center d-flex justify-content-center'>
<div class='col-2' style='margin-top: 0; position:absolute;top:0;left: 20px'>
<img class='img-fluid indep-sub-image' src='../../../dist/img/admin_logo.png' width='100px' height='100px'>
</div>
<div class='col-12' style=' color: black; text-align: center; text-justify:inter-word;'>
<div style = 'text-align:center; display: inline-block;' >
<div style='font-size:13px; color:green'>Republic of the Philippines<br></div>
<div class='mb-0' style='font-size: 14px; color: darkblue;'><b>DEPARTMENT OF ENVIRONMENT AND NATURAL RESOURCES</b></div>
<p class='mb-0' style='font-size:13px; color:red;'><b>Regional Office No. IX</b></p>
<p style='font-size:12px;'>PCCARGC, Balintawak, Pagadian City, 7016 Zamboanga del Sur<br>
Telefax No: (062) 945-0870 Website: r9.denr.gov.ph
</p>
</div>
</div>
<div class='col-2' style='margin-top:0; position:absolute;top:0;right: 20px'>
<img class='img-fluid indep-sub-image' src='../../../dist/img/bagong_pilipinas.png' width='100px' height='100px'>
</div>
<div class='row'>
<div class='card-body' style='margin-right: 30px; margin-left: 30px;'>
<div class='row justify-content-center'>
<hr>
</div>
<div class='row justify-content-center'>
<div class='col-md-12'>
<h3 style='text-align: center; color: black; font-family: Times New Roman;'><b>C E R T I F I C A T I O N</b></h3>
</div>
</div>
<div class='row mt-5'>
<div class='col-md-12'>
<p style='text-align: justify; text-justify:inter-word; font-size: 12px; color: black;'><b>TO WHOM IT MAY CONCERN:</b></p>
</div>
</div>
<div class='row mt-3'>
<div class='col-md-12'>
<p style='text-align: justify; text-justify:inter-word; font-size: 12px;'>
<strong>      THIS IS TO CERTIFY</strong> that per records of this Office, <span><strong>$name $name1</strong></span>
has the following leave credit balance as of $asofDate, to wit:
</p>
<div>
<table class='table table-borderless' style='font-size: 12px; text-align: justify; text-justify:inter-word; margin-right: 50px; margin-left: 50px; line-height: 2px;'>
<tr>
<td class='col-2' style='text-align: left;'>VACATION LEAVE</td>
<td class='col-2' style='text-align: center;'>-</td>
<td class='col-2' style='text-align: left;'>$det1[13] day(s)</td>
</tr>
<tr>
<td class='col-2' style='text-align: left;'>SICK LEAVE</td>
<td class='col-2' style='text-align: center;'>-</td>
<td class='col-2' style='text-align: left;'> $det1[14] day(s)</td>
</tr>";
$total = $det1[13] + $det1[14];
$tv = number_format($total,2);
echo"
<tr>
<td style='text-align: left;'><b>TOTAL</b></td>
<td class='col-2' style='text-align: center;'>-</td>
<td style='text-align: left;'><b> $tv day(s)</b></td>
</tr>
</table>
</div><br>
<p style='text-align: justify; text-justify:inter-word; font-size: 12px; color: black;'>
<strong>     THIS CERTIFICATION</strong> is issued to support the <span> $det1[2]</span> of Mr./ Ms. $det1[2].
</p><br>
<p style='text-align: justify; text-justify:inter-word; font-size: 12px; color: black;'>
     Issued this $day day of $month, Pagadian City, Zamboanga del Sur Philippines.
</p><br><br>
<div class='wrap'>
<div class='row'>
<div class='table-responsive'>
<table class='table table-nowrap table-borderless align-bottom mt-0'>
<tbody>
<tr>
<div class='content' style='text-align: center; text-justify:inter-word; color: black; font-size:7px; position: absolute; right:70px;'>";
if ($bb != null and $adm_usr != null) {
echo "$digitally_signed_by<br>";
echo "<b>$chief_approval</b><br>ON ";
echo "$date_signed<br>";
}
echo"
</div>
</tr>
<tr>
<td>
<div class='col-6 text-end' style='text-align: center; text-justify:inter-word; color: black; font-size: 12px;'>
<div id='qrDivId-$index'></div>
</div>
<div style='font-size:12px'>  $det1[1]</div>
</td>
<td>
<div class='col-md-12' style='text-align: center; text-justify:inter-word; color: black; font-size: 12px;'>
<div class='content' style='float:right; width:180px;'>";
if ($bb != null and $adm_usr != null) {
echo "
<div class='content'>
<img src='../../tops/esig/$adm_usr[1].png' alt='signature' width='80px' height='80px'>
</div> ";
}
echo "<b>$chief_approval</b><br>";
echo $adm_usr[10];
echo"
</div>
</div>
</td>
<td></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>";
if ($det1[9] == 'Approved') {
echo "
<div class='row mt-4 fixed-bottom'>
<div class='content' style='text-align: center; text-justify: inter-word; font-size:9px; font-style: italic;'>
THIS IS AN OFFICIAL DOCUMENT APPROVED DIGITALLY AND GENERATED FROM THE DENR-IX INTEGRATED INFORMATION SYSTEM.<br>
NO ORIGINAL SIGNATURE IS REQUIRED
</div>
</div> ";
}
echo"
<div class='footer'>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>";
// Generate unique QR Code container IDs
$qrDivId = "qrDivId-$index";
// Generate the QR code container for each iteration
echo "<div id='$qrDivId' style='display: none;'></div>";
$index++; //Increment the index for the next QR Code
}
?>
<!-- END OF CONDITION FOR REQUEST TYPE ----->
<?php
//footer for view certificates
//modal
include('modal_view_cert.php');
?>
</body>
<!-- Footer -->
<?php include('../link/footer-sublink.php');?>
<!-- Separate Script to Initialize QR Codes -->
<script src='qr-code/qrcode.min.js'></script>
<script type='text/javascript'>
document.addEventListener('DOMContentLoaded', function() {
// Iterate through all QR code containers and initialize
for (let i = 1; i <= <?php echo $index - 1; ?>; i++) {
const qrCodeContainerId = `qrDivId-${i}`;
const qrCodeData = '<?php echo $linkcert ?>'.replace(/\/g, '');
// Ensure the container exists
const container = document.getElementById(qrCodeContainerId);
if (container) {
// Clear any previous content in the container
container.innerHTML = '';
const qrCode = new QRCodeStyling({
width: 150,
height: 150,
type: 'png',
data: qrCodeData,
image: 'qr-code/logo_denr.png',
backgroundOptions: {
color: '#ffffff',
},
imageOptions: {
crossOrigin: 'anonymous',
margin: 0,
}
});
qrCode.append(container);
}
}
});
</script>
<script>
window.addEventListener('load', function() {
// Event listener for after the print dialog is closed (either print or cancel)
window.onafterprint = function() {
// Redirect to the previous page
window.history.back(); // Go back to the previous page
};
// Fallback in case 'onafterprint' doesn't work on some browsers
setTimeout(function() {
window.location.href = 'http://localhost/r9_iis/main/spics/certificates/view_certificate?link=<?php echo $id_encrypt; ?>';
}, 1000);
});
</script>
i even ask in chatgpt and is not helping