Solved: Re: HTML codes review - PDF table not appearing as...

Lingam · ‎11-17-2020

Hi, I am working on PDF attachment via Microsoft flow, HTML seems not working fine as well as PDF 😐

Below my code:

___________________________________

"<html>
<head>
<style>

table, td, th {
border: 1px Solid black;
}

table {
width: 100%;
border-collapse: collapse;
}
td {
text-align: center;
}

h2 {
text-align: center;
}

h3 {
text-align: center;
color: red
}

</style>
</head>
<body>

<h2>NATIONAL INSTRUMENTS CORPORATION 1994 EMPLOYEE STOCK PURCHASE PLAN</h2>
<h3>SUBSCRIPTION STATUS</h3>
<table>
<tr>
<th>Employee Name:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label27 )
&
"

<tr>
<th>Enrollment:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label26)
&
"
</tr>

<tr>
<th>ESPP Rate:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label25)
&
"
</tr>

<tr>
<th>Enrolled quarter:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label29)
&
"
</tr>

</tr>

<tr>
<th>Beneficiaries:</th>
</tr>
<tr>
<th>First Name:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label39)
&
"
</tr>

<tr>
<th>Middle Name:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label40)
&
"
</tr>
<tr>
<th>Last Name:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label41)
&
"
</tr>

<tr>
<th>Relationship:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label42)
&
"
</tr>

</tr>

<tr>
<th>Address Details:</th>
</tr>

<tr>
<th>Address Line 1:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label45)
&
"
</tr>

<tr>
<th>Address Line 2:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label46)
&
"
</tr>

<tr>
<th>Address Line 3:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label48)
&
"
</tr>

<tr>
<th>City:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label51)
&
"
</tr>

<tr>
<th>State/Province:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label52)
&
"
</tr>

<tr>
<th>Zipcode:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label53)
&
"
</tr>

</tr>

<tr>
<th>Acknowledgement:</th>
</tr

<tr>
<th>Digital Signature:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label57 & "</tr><td>" )
&
"
</tr>

<tr>
<th>Date:</th>
"
&
Concat(Gallery5.AllItems, "<td><td>" & Label60)
&
"
</tr>

</Table>

<html>"

_________________________________________________________

v-siky-msft · ‎11-17-2020

Hi @Lingam ,

I found some mistakes in your HTML script.

The most serious one is is that the table cell data should be written between <td> and </td> tags, so the concat() function should be modified as follows.

Concat(Gallery5.AllItems, "<td>" & Label27&"</td>" )

HTML filePDF file

The full HTML script after modification:

"<html>
<head>
<style>
table, td, th {
border: 1px Solid black;
}
table {
width: 100%;
border-collapse: collapse;
}
td {
text-align: center;
}
h2 {
text-align: center;
}
h3 {
text-align: center;
color: red
}
</style>
</head>

<body>
<h2>NATIONAL INSTRUMENTS CORPORATION 1994 EMPLOYEE STOCK PURCHASE PLAN</h2>
<h3>SUBSCRIPTION STATUS</h3>
<table>
<tr>
<th>Employee Name:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label27&"</td>")&"
</tr>

<tr>
<th>Enrollment:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label26&"</td>")&"
</tr>

<tr>
<th>ESPP Rate:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label25&"</td>")&"
</tr>

<tr>
<th>Enrolled quarter:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label29&"</td>")&"
</tr>

<tr>
<th>**</th>
</tr>

<tr>
<th>Beneficiaries:</th>
</tr>

<tr>
<th>First Name:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label39&"</td>")&"
</tr>

<tr>
<th>Middle Name:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label40&"</td>")&"
</tr>

<tr>
<th>Last Name:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label41&"</td>")&"
</tr>

<tr>
<th>Relationship:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label42&"</td>")&"
</tr>

<tr>
<th>**</th>
</tr>

<tr>
<th>Address Details:</th>
</tr>

<tr>
<th>Address Line 1:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label45&"</td>")&"
</tr>

<tr>
<th>Address Line 2:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label46&"</td>")&"
</tr>

<tr>
<th>Address Line 3:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label48&"</td>")&"
</tr>

<tr>
<th>City:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label51&"</td>")&"
</tr>

<tr>
<th>State/Province:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label52&"</td>")&"
</tr>

<tr>
<th>Zipcode:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label53&"</td>")&"
</tr>


<tr>
<th>**</th>
</tr>

<tr>
<th>Acknowledgement:</th>
</tr>

<tr>
<th>Digital Signature:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label57&"</td>")&"
</tr>

<tr>
<th>Date:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label60&"</td>")&"
</tr>

</Table>
</body>

<html>")

Hope this helps.

Sik

View solution in original post

v-siky-msft · ‎11-23-2020

Hi @Lingam ,

OK, I got it.

First, there is no need to save the trigger body to variable. you can reference the field value from the Dynamic Content directly from the trigger, rather than retrieve them from Variable.

Second, since Employee Name is person field, you should select 'Employee Name DisplyaName' to obtain the Name. The same goes for ESPP Selection, you should select 'ESPP Selection Value' from dynamics content as ESPP Selection is Choices Field.

Hope this helps.

Sik

View solution in original post

v-siky-msft · ‎11-17-2020

Hi @Lingam ,

I found some mistakes in your HTML script.

The most serious one is is that the table cell data should be written between <td> and </td> tags, so the concat() function should be modified as follows.

Concat(Gallery5.AllItems, "<td>" & Label27&"</td>" )

HTML filePDF file

The full HTML script after modification:

"<html>
<head>
<style>
table, td, th {
border: 1px Solid black;
}
table {
width: 100%;
border-collapse: collapse;
}
td {
text-align: center;
}
h2 {
text-align: center;
}
h3 {
text-align: center;
color: red
}
</style>
</head>

<body>
<h2>NATIONAL INSTRUMENTS CORPORATION 1994 EMPLOYEE STOCK PURCHASE PLAN</h2>
<h3>SUBSCRIPTION STATUS</h3>
<table>
<tr>
<th>Employee Name:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label27&"</td>")&"
</tr>

<tr>
<th>Enrollment:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label26&"</td>")&"
</tr>

<tr>
<th>ESPP Rate:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label25&"</td>")&"
</tr>

<tr>
<th>Enrolled quarter:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label29&"</td>")&"
</tr>

<tr>
<th>**</th>
</tr>

<tr>
<th>Beneficiaries:</th>
</tr>

<tr>
<th>First Name:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label39&"</td>")&"
</tr>

<tr>
<th>Middle Name:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label40&"</td>")&"
</tr>

<tr>
<th>Last Name:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label41&"</td>")&"
</tr>

<tr>
<th>Relationship:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label42&"</td>")&"
</tr>

<tr>
<th>**</th>
</tr>

<tr>
<th>Address Details:</th>
</tr>

<tr>
<th>Address Line 1:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label45&"</td>")&"
</tr>

<tr>
<th>Address Line 2:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label46&"</td>")&"
</tr>

<tr>
<th>Address Line 3:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label48&"</td>")&"
</tr>

<tr>
<th>City:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label51&"</td>")&"
</tr>

<tr>
<th>State/Province:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label52&"</td>")&"
</tr>

<tr>
<th>Zipcode:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label53&"</td>")&"
</tr>


<tr>
<th>**</th>
</tr>

<tr>
<th>Acknowledgement:</th>
</tr>

<tr>
<th>Digital Signature:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label57&"</td>")&"
</tr>

<tr>
<th>Date:</th>
"&Concat(Gallery5.AllItems,"<td>"&Label60&"</td>")&"
</tr>

</Table>
</body>

<html>")

Hope this helps.

Sik

Lingam · ‎11-18-2020

Hi @v-siky-msft ,

it seems that html shows as per following :(, why the value not triggered?

PDF as well 😐

Powersapp snapshot shows correctly:

v-siky-msft · ‎11-18-2020

Hi @Lingam ,

Have you tried the full HTML script I posted above?

There are several mistakes in your original script, and this issue is because you miss a </tr> tag in Enrollment block.

The full modified script I posted above has been verified to work properly, you can refer to it directly

Hope this helps.

Sik

Lingam · ‎11-22-2020

@v-siky-msft ,

Thank you for sorting the above code issue, this solves and another issue need your help, do you know why i can't extract share point data using flow? code as per below?

concat('<!DOCTYPE html>

table, td, th {
border: 1px Solid black;
border-collapse: collapse;
}

th,td {
padding: 15px;
text-align: left;
}

table#01 {
width:100%;
background-color: #f1f1c1;
}

</style>
</head>

<body>
<h2>NATIONAL CORP</h2>
<h3>SUBSCRIPTION STATUS</h3>

<table style="witdth:100%">
<tr><td>Employee Name:</td><td>',variables('ObjectList')?['Employee Name'],'</td></tr>
<tr><td>ESPP Rate:</td><td>',variables('ObjectList')?['People_x0020_Auto'],'</td></tr>
<tr><td>ESPP Rate:</td><td>',variables('ObjectList')?['ESPP Selection'],'</td></tr>
<tr><td>ESPP Rate:</td><td>',variables('ObjectList')?['&Concat(Gallery4.AllItems,&Label27&)&'],'</td></tr>

</body>

<html>')

Lingam · ‎11-22-2020

attachement for your reference ...

v-siky-msft · ‎11-22-2020

Hi @Lingam ,

I made a test based on the following concat() function and script in flow, and it work properly. I reference a Title field from Object variable I defined.

concat('<!DOCTYPE html>

<html>
<head>
<style>

table, td, th {
border: 1px Solid black;
border-collapse: collapse;
}

th,td {
padding: 15px;
text-align: left;
}

table#01 {
width:100%;
background-color: #f1f1c1;
}


</style>
</head>

<body>
<h2>NATIONAL CORP</h2>
<h3>SUBSCRIPTION STATUS</h3>

<table style="witdth:100%">
<tr><td>Employee Name:</td><td>',variables('ObjectList')?['Title'],'</td></tr>
<tr><td>ESPP Rate:</td><td>',variables('ObjectList')?['Title'],'</td></tr>
<tr><td>ESPP Rate:</td><td>',variables('ObjectList')?['Title'],'</td></tr>
<tr><td>ESPP Rate:</td><td>',variables('ObjectList')?['Title'],'</td></tr>

</table>
</body>

<html>')

Could you please share more details about your ObjectList on your scenario?

In addition, I can't understand the 'variables('ObjectList')?['&Concat(Gallery4.AllItems,&Label27&)&']' in last row. Could you please elaborate on this?

Sik

Lingam · ‎11-23-2020

@v-siky-msft ,

Thank you so so much to you 😊

At first I can't understand what is "object list" definition, where I need to find this object list?

I am snapping my share point list column below, which name that i should apply to this object list? in your solution is "ABC"

I am adding 2 snapshot:

1: Share point list column & 2. flow steps which match with your snapshot above but it still not working 😐

Flow steps that i created >>

1. In Initialize Variable

- the code

Name: "ObjectList" followed by

Type: Object and

Value: body ( from share point)

2. Compose:

exact code that i attached to you earlier

v-siky-msft · ‎11-23-2020

Hi @Lingam ,

OK, I got it.

First, there is no need to save the trigger body to variable. you can reference the field value from the Dynamic Content directly from the trigger, rather than retrieve them from Variable.

Second, since Employee Name is person field, you should select 'Employee Name DisplyaName' to obtain the Name. The same goes for ESPP Selection, you should select 'ESPP Selection Value' from dynamics content as ESPP Selection is Choices Field.

Hope this helps.

Sik

HTML codes review - PDF table not appearing as required

Helpful resources

Power Apps News & Announcements

Introducing the Community Calls Conversations

Power Apps Community Blog