when user click button; I want to generate pdf of current page. below is my code for which page I want to generate pdf:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Report LandsScape</title>
<link rel="stylesheet" href="/css/report.css">
</head>
<body>
<main>
<?php
// Connect to your database
include "connection_string.php";
?>
<div class = "background">
<div class ="left">
<button id="generatePdf">Generate PDF</button>
<?php
$imagePath = 'icon/ceramtec-gmbh.png';
$imageData = file_get_contents(__DIR__ . '/' . $imagePath);
$imageBase64 = 'data:image/png;base64,' . base64_encode($imageData);
echo '<img src='.$imageBase64.' class="ceram_logo">'; ?>
</main>
<script>
document.getElementById('generatePdf').addEventListener('click', function() {
console.log('Button click');
// Send an AJAX request to generate the PDF
var xhr = new XMLHttpRequest();
xhr.open('GET', 'pdf_generator.php', true);
xhr.responseType = 'blob';
xhr.onload = function() {
if (xhr.status === 200) {
// Create a blob from the response
var blob = new Blob([xhr.response], { type: 'application/pdf' });
// Create a link element to trigger the download
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = 'generated_pdf.pdf';
// Append the link to the body and trigger the click event
document.body.appendChild(link);
link.click();
// Remove the link from the body
document.body.removeChild(link);
}
};
xhr.send();
});
</script>
</body>
</html>
Below is the code where I configure my dompdf::
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
require 'vendor/autoload.php';
require_once 'dompdf/autoload.inc.php';
// Enable remote files
define('DOMPDF_ENABLE_REMOTE', true);
use Dompdf\Dompdf;
use Dompdf\Options;
// Function to fetch the HTML content of report_pdf.php
function fetchHtmlContent($filename) {
ob_start();
include $filename;
return ob_get_clean();
}
// Initialize DOMPDF
$options = new Options();
$options->set('isHtml5ParserEnabled', true);
$options->set('isPhpEnabled', true);
$dompdf = new Dompdf($options);
// Set base path for assets (styles, images)
//$basePath = 'http://localhost:3000/';
//$basePath = realpath(__DIR__ . '/') . DIRECTORY_SEPARATOR;
//$basePath = realpath(dirname(__FILE__)) . DIRECTORY_SEPARATOR;
$basePath = 'C:\Users\dhara\Desktop\ProQM' . DIRECTORY_SEPARATOR;
$dompdf->setBasePath($basePath);
// Load HTML content from report_pdf.php
$html = fetchHtmlContent(__DIR__ . '/test_report.php');
$dompdf->loadHtml($html);
// Set paper size (optional)
$dompdf->setPaper('A4', 'portrait');
// Render PDF (first pass to get total pages)
$dompdf->render();
// Output the generated PDF (inline, download, or save to file)
$dompdf->stream('output.pdf', ['Attachment' => 0]);
?>
The problem here is; I got my pdf but without css. Can you please find the error or suggest some modification to get stylesheet with pdf file.
try to create basepath