Solved: Create a PDF from a Form response

JPK8123 · ‎07-21-2022

Hi All,

Very new to Power Automate and slowly getting to grips with the app.

I've created a Form response, of which I want to create a flow that will generate a PDF with a logo (which is saved in my OneDrive account), with the information from the Form response.

The steps I have in mind are:

Staff Member completes the Form,
Flow is created with two steps:
1. an email is sent to a different staff member with a table of the form responses,
2. a PDF is created, which has the company logo (logo is saved in the OneDrive), and with the same response information in table form (same as the above email idea).

In the end, and email and a PDF will be created. The PDF filename will be the "name" response from the completed Form.

Attached is an idea for the PDF output.

I hope this explanation is easy to read.

Kind regards,

JP

v-yujincui-msft · ‎07-22-2022

Hi @JPK8123 ,

I have made a simple test for your reference.

1. Here is my MS Forms.

2. Here is my Flow.

body('Get_file_content')?['$content']

<!DOCTYPE html>
<html>
<style>
table, th, td {
  border:1px solid black;
}
</style>
<body>

<h2><img src="data&colon;image/jpg;base64,@{body('Get_file_content')?['$content']}" width="100" height="100" alt="logo" /></h2>


<table style="width:100%">
  <tr>
    <th>Question1</th>
    <th>Question2</th>
    <th>Question3</th>
  </tr>
  <tr>
    <td>@{outputs('Get_response_details')?['body/rf94e0b9461d74028abe12b9954911f73']}</td>
    <td>@{outputs('Get_response_details')?['body/r2fb3bf6116c345638cf7a84df2a4fe02']}</td>
    <td>@{outputs('Get_response_details')?['body/reabab42316c74a96b6a35afb5894749e']}</td>
  </tr>
</table>

</body>
</html>

Result Screenshot:

In addition, maybe you need to modify some HTML code to match your actual needs, all I can do is provide ideas.

Best Regards,

Charlie Choi

View solution in original post

v-yujincui-msft · ‎08-03-2022

Hi @JPK8123 ,

Please see the code difference in the red box.

Best Regards,
Charlie Choi

View solution in original post

RiverlandWeb · ‎07-21-2022

I have completed the exact same scenario.

My steps were as follows.

Have the form go into a SharePoint list.
Create a word document from the SP List
Convert the word document to PDF
attach the PDF to e-mail.

I learned all of the steps by watching DeShon Clark on YouTube.
https://www.youtube.com/playlist?list=PLMLjnY5iPR3VI4q4Sv6IfhOIuZAKJi-r_

v-yujincui-msft · ‎07-22-2022

Hi @JPK8123 ,

I have made a simple test for your reference.

1. Here is my MS Forms.

2. Here is my Flow.

body('Get_file_content')?['$content']

<!DOCTYPE html>
<html>
<style>
table, th, td {
  border:1px solid black;
}
</style>
<body>

<h2><img src="data&colon;image/jpg;base64,@{body('Get_file_content')?['$content']}" width="100" height="100" alt="logo" /></h2>


<table style="width:100%">
  <tr>
    <th>Question1</th>
    <th>Question2</th>
    <th>Question3</th>
  </tr>
  <tr>
    <td>@{outputs('Get_response_details')?['body/rf94e0b9461d74028abe12b9954911f73']}</td>
    <td>@{outputs('Get_response_details')?['body/r2fb3bf6116c345638cf7a84df2a4fe02']}</td>
    <td>@{outputs('Get_response_details')?['body/reabab42316c74a96b6a35afb5894749e']}</td>
  </tr>
</table>

</body>
</html>

Result Screenshot:

In addition, maybe you need to modify some HTML code to match your actual needs, all I can do is provide ideas.

Best Regards,

Charlie Choi

v-yujincui-msft · ‎07-22-2022

.

JPK8123 · ‎08-02-2022

Hi v-yujincui-msft

Apologies for the late reply.

Many thanks for the flow profile, easy to understand and complete. However, Once the Flow had run correctly, and the PDF was created; I opened the created file and the data was good, but the logo did not show (see attached). Any ideas?

Screenshot 2022-08-02 at 14.48.12.png

JPK8123 · ‎08-02-2022

Thank you for your response.

I viewed some of the videos and they are helpful.

Many thanks for the link.

JP

v-yujincui-msft · ‎08-02-2022

Hi @JPK8123 ,

Could you please provide a screenshot of your flow setup and your HTML code? That make it much easier to assist.

1. I'm assuming this is the logo image I have saved in OneDrive.

<img src="data&colon;image/jpg;base64,@{body('Get_file_content')?['$content']}" width="100" height="100" alt="logo" />

2. Here is my Flow.

Result Screenshot:

Best Regards,
Charlie Choi

JPK8123 · ‎08-03-2022

Hi Charlie,

Yes, the logo is saved in the OneDrive; see pic below.

Regards,

JP

v-yujincui-msft · ‎08-03-2022

Hi @JPK8123 ,

Please see the code difference in the red box.

Best Regards,
Charlie Choi

JPK8123 · ‎08-03-2022

It works. Happy days.

Many thanks for this, you really have helped me out here.

Another question, how do I mover the logo to the right side of the page?

Regards,

JP

v-yujincui-msft · ‎08-03-2022

Hi @JPK8123 ,

Maybe you could try as below:

style="text-align: right;"

Here is a link that for your reference.

https://blogs.ntu.edu.sg/ntulibrary/2018/09/12/how-to-align-images-on-your-website/

Best Regards,
Charlie Choi

JPK8123 · ‎08-04-2022

It worked as you suggested, fantastic. Thank you for the indication.

With the code I'm going to post below, I'm hoping to get the logo and table centred on the PDF; see below:

No need to worry about the output text, I have this covered. As you can see, logo and table are centered; this is displayed through an HTML test website; so all good. However, when I use the same code in the COMPOSE section in the FLOW, the table remains to the left; see below: