How to merge multiple PDF files into one single PDF on the click of UI Action and attach PDF.

sisf · ‎11-29-2023

How to merge multiple pdf files into one single pdf on the click of UI Action -

Please see below scenario -

1. On a record there are multiple PDF's.

2. On a click of UI Action button , all PDF's should be combined to form one single PDF.

3. Combined PDF should be attached to the same record.

Sandeep Rajput · ‎11-29-2023

@sisf I found a question on the similar lines here https://www.servicenow.com/community/developer-forum/merge-multiple-pdf/m-p/2547042.

Also, if you are open to use RPA hub, then it also provides a PDF connector here are the details https://docs.servicenow.com/bundle/vancouver-integrate-applications/page/product/rpa-studio/concept/...

Hope this helps.

sisf · ‎11-29-2023

@Sandeep Rajput Thanks for Replying. But solution proposed is not complete and lack detailed steps , due to which it's difficult to implement.

Nope , we cannot use RPA.

I am trying use PDF-lib min.js file in UI Script and calling that in UI Page using HTML input file. It's working fine and able to merge the PDF's.
-----------------------------------------------------------------------------------------------------------------------------------------
This is the Code of UI Page :

<?xml version="1.0" encoding="utf-8" ?>

<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

<html>

<head>

function readFileAsync(file) {

return new Promise((resolve, reject) => {

let reader = new FileReader();

reader.onload = () => {

resolve(reader.result);

};

reader.onerror = reject;

reader.readAsArrayBuffer(file);

})

}

function download(file, filename, type) {

const link = document.getElementById('link');

link.download = filename;

let binaryData = [];

binaryData.push(file);

link.href = URL.createObjectURL(new Blob(binaryData, {type: type}))

}

async function merge() {

let PDFDocument = PDFLib.PDFDocument;

const in1 = document.getElementById('file1').files[0];

const in2 = document.getElementById('file2').files[0];

let bytes1 = await readFileAsync(in1);

let bytes2 = await readFileAsync(in2);

const pdf1 = await PDFDocument.load(bytes1);

const pdf2 = await PDFDocument.load(bytes2);

const mergedPdf = await PDFDocument.create();

const copiedPagesA = await mergedPdf.copyPages(pdf1, pdf1.getPageIndices());

copiedPagesA.forEach((page) => mergedPdf.addPage(page));

const copiedPagesB = await mergedPdf.copyPages(pdf2, pdf2.getPageIndices());

copiedPagesB.forEach((page) => mergedPdf.addPage(page));

const mergedPdfFile = await mergedPdf.save();

download(mergedPdfFile, 'Merged.pdf', 'application/pdf')

}

</script>

</head>

<body>

<button onclick="merge()">Merge</button>

<a id="link">Download</a>

</body>

</html>

</j:jelly>

-----------------------------------------------------------------------------------------------------------------------------------------

It's working fine and able to merge the PDF's.

But our scenario is to to merge the pdf files already attached to the record using UI Action. So not able to implement this. Is there any way we can leverage above code to create UI action to merge the pdf.
PS - I have already saved min.js in UI script , which is global.

sisf · ‎11-30-2023

@Shakeel Shaik @Allen Andreas @Amit Gujarathi @Mark Roethof Hello All, Can you please help with the below issue :

How to merge multiple pdf files into one single pdf on the click of UI Action -

Please see below scenario -

1. On a record there are multiple PDF's.

2. On a click of UI Action button , all PDF's should be combined to form one single PDF.

3. Combined PDF should be attached to the same record.

Please reach out incase more information is required from my end.

JavaScriptGuy · ‎12-04-2023

@Ankur Bawiskar Can you help with the above requirements , I saw that you have given explaination on mid server way , It would be great , if you can elaborate that.