Generate a pdf report from html view

Hi there,

I'm considering to add a feature to my app which is generate a report of a tabled created with html view based on SQLite

At the moment I considering to create a first section more like an index of documents and the second part include the documents ordered accordingly to the first section

So far I've created an html table, my quickest idea will be to transform the html to pdf and download it.

Is it possible? Which extension can be used?

If this is not possible, which steps should I follow?

Regardless the process, the idea is that by requesting a report no further action will b required to obtain it

Cheers

Does this have to be an on app pdf generation, or will the device also have internet access to perform this function?

Any reason you have chosen to use an html table - presumably in a webview ?

Hi @TIMAI2

I used table view to generate a report.

To answer your question regarding being an on app pdf generator or not, I haven't considered it yet also because I don't know the alternatives. I think that nowadays it is really unlikely to be off line and both options can b feasible.
I'm open to both options to study and learn how to implement

Cheers

You mean the Tableviewer extension?

I have worked up a solution to generate a pdf from a Tableviewer table. In essence, we grab the source code for the created table, add some more javascript to it, open this in a webviewer, then download the pdf.

You will see I have adjusted the font-size of the text on the table, to ensure it fits the screen.

The webviewextra extension is also required to handle the blob download in the webviewer, which afaik, cannot be done in Tableviewer

The example blocks download a table of csv data from a google sheet.

Blocks

Script added

note that this calls in a script js file from a CDN online. This could always be downloaded to the device and fetched to the html file as an asset, allowing this activity to take place without data/internet connectivity.

<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script>
<script>
    const getBody = document.getElementsByTagName("body");
    getBody[0].setAttribute("id", "body");


    function downloadFunction() {

        const element = document.getElementById('body');
        const formattedDate = new Date().toLocaleDateString('en-GB').replace(/\//g, '-');
        const options = {
            margin: 10,
            filename: 'FileName_' + formattedDate + '.pdf',
            image: { type: 'jpeg', quality: 1.0 },
            html2canvas: { scale: 4 },
            jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
        };
        html2pdf(element, options);

    }
</script>

The pdf that is created is of images of pages, so no searchable/selectable text...

Example output

file_1734009684432.pdf (3.5 MB)

ref

Credits @Kevinkun for the Tableviewer extension

If you plan to refry your data later, Google Sheets is more flexible than PDFs.

@TIMAI2
Thanks for your script and blocks. I'll give it a go when time allow

@ABG
So far I can't foresee the added value using Google sheet VS a static pdf file which I can overwrite if required. By all mean I'll keep it in mind for future reference and future apps

Thanks for your opinion and help

Cheers