Solved: How To send a gallery through email using HTML

Broly123 · ‎07-11-2023

Hello! I'm creating a shopping cart app. I have a galley showing the items the user has selected to order. Now I want to submit the gallery as well as the text labels outside of the gallery using HTML. What i tried to do was insert a html text inside the gallery and use that text in the email. But I don't know how to grab ALL of the items into one HTML (if possible) to submit in an email as one body

Thanks to who can help

cwebb365 · ‎07-12-2023

The example you gave is just style stuff. Not actual HTML. You need to build your actual HTML body first with dummy data. Then you just have to insert the data from your collection/s.

So for example in mine, It would look like this, where I would use concat on the repeating part shown here:

<tr>
<td>
<p><span>Chris Webb</span></p>
</tr>
</td>
<tr>
<td>
<p><span>Chris Webb2</span></p>
</tr>
</td>
<tr>
<td>
<p><span>Chris Webb3</span></p>
</tr>
</td>

So from a known working HTML. Don't worry about putting data in yet. Get it in, with just test values. Send it and make sure it looks good.

Once you get that. Then you take that HTML and just insert your dynamic data. So for the list part shown above, I would use concat to do the repeating part for each name.

"<begininghtmluntilthelist></>"
 & Concat(
        Datasource,
"<p><span>"& FullName &"</span></p>
</tr>
</td>
<tr>
<td>
"

I took the section with the repeating 3. Took 1 of them, and then put it in the concat(). with the datasource putting Fullname column from that datasource in with the repeating html. This will repeat that section for however many items are in the given datasource with that column in there.

Don't over complicate it. Get the HTML in first with a full example working. Then just insert your dynamic values in place of the values in your example and call it a day. Single values you can pull direct with Lookup() functions from your datasource and repeating lists you use concat to repeat those blocks of code around each item.

View solution in original post

cwebb365 · ‎07-11-2023

You want to utilize the html control and put your HTML code there. I use a template I found in word and stripped all the bogus HTML out of it then pasted it in. Then in the Table part for your order details or whatever, you can utilize Concat() function. Here is a sample snippet from one of my e-mails listing dependants and some information from the Dependants colleciton (datasource).

</td>
</tr>" & Concat(
        Dependants,
        "
<tr>
<td style=""width: 214.55pt; border: solid white 2.25pt; border-top: none; background: #F2F2F2; padding: 1.45pt 5.4pt 1.45pt 5.4pt;"" width=""286"">
<p style=""margin: 1.0pt 0in 1.0pt 0in;""><span style=""color: black;"">" & FirstName & " " & LastName & "</span></p>
</td>
<td style=""width: 1.0in; border-top: none; border-left: none; border-bottom: solid white 2.25pt; border-right: solid white 2.25pt; background: #F2F2F2; padding: 1.45pt 5.4pt 1.45pt 5.4pt;"" width=""96"">
<p style=""margin: 1.0pt 0in 1.0pt 0in;""><span style=""color: black;"">" & Gender & "</span></p>
</td>
<td style=""width: 1.0in; border-top: none; border-left: none; border-bottom: solid white 2.25pt; border-right: solid white 2.25pt; background: #F2F2F2; padding: 1.45pt 5.4pt 1.45pt 5.4pt;"" width=""96"">
<p style=""margin: 1.0pt 0in 1.0pt 0in;""><span style=""color: black;"">" & If(
            Medical && Dental && Vision,
            "All",
            If(
                Medical,
                " M",
                ""
            ) & If(
                Dental,
                " D",
                ""
            ) & If(
                Vision,
                " V",
                ""
            )
        ) & "</span></p>
</td>

This basically takes a formatted row in the table and repeats it for each record / row in the datasource using those values.

Broly123 · ‎07-12-2023

@cwebb365 Thats the part im confused with. How do I grab the HTML text from my gallery?

cwebb365 · ‎07-12-2023

You don't put html text in the gallery, you hide it somewhere on the page at the root level. Then you build your e-mail body in that html text. Then you use Concat() for your item's from the gallery. You can even use gallery.allitems probably in the concat function for your datasource if you want to send what's showing in the gallery.

So you put a htmltext outside the gallery in your page somewhere, visable = false. Then put the html in it. In the section that needs the items concat( gallery.allitems, "<html stuff> " & Columnname & "<html stuff> <br> <html stuff>" & Column2name & "<htmlstuff>")

any quotes in the html will need double quotes. etc.

Then you use the htmltext control in your sendemail function on onclick or whatever.

Broly123 · ‎07-12-2023

@cwebb365 Ok so that was the biggest part I was confused about where people were getting the HTML code from. You were able to find a template and fixed it up. I have this HTML I found. I'm still unsure which section I would plug in the Concat(gallery.allitems in this html code.

<style>
table {
  border: 1px solid #1C6EA4;
  background-color: #EEEEEE;
  width: 100%;
  text-align: left;
  border-collapse: collapse;
}
table td, table th {
  border: 1px solid #AAAAAA;
  padding: 3px 2px;
}
table tbody td {
  font-size: 13px;
}
table thead {
  background: #1C6EA4;
  border-bottom: 2px solid #444444;
}
table thead th {
  font-size: 15px;
  font-weight: bold;
  color: #FFFFFF;
  border-left: 2px solid #D0E4F5;
}
table thead th:first-child {
  border-left: none;
}
</style>

cwebb365 · ‎07-12-2023

The example you gave is just style stuff. Not actual HTML. You need to build your actual HTML body first with dummy data. Then you just have to insert the data from your collection/s.

So for example in mine, It would look like this, where I would use concat on the repeating part shown here:

<tr>
<td>
<p><span>Chris Webb</span></p>
</tr>
</td>
<tr>
<td>
<p><span>Chris Webb2</span></p>
</tr>
</td>
<tr>
<td>
<p><span>Chris Webb3</span></p>
</tr>
</td>

So from a known working HTML. Don't worry about putting data in yet. Get it in, with just test values. Send it and make sure it looks good.

Once you get that. Then you take that HTML and just insert your dynamic data. So for the list part shown above, I would use concat to do the repeating part for each name.

"<begininghtmluntilthelist></>"
 & Concat(
        Datasource,
"<p><span>"& FullName &"</span></p>
</tr>
</td>
<tr>
<td>
"

I took the section with the repeating 3. Took 1 of them, and then put it in the concat(). with the datasource putting Fullname column from that datasource in with the repeating html. This will repeat that section for however many items are in the given datasource with that column in there.

Don't over complicate it. Get the HTML in first with a full example working. Then just insert your dynamic values in place of the values in your example and call it a day. Single values you can pull direct with Lookup() functions from your datasource and repeating lists you use concat to repeat those blocks of code around each item.

Broly123 · ‎07-13-2023

@cwebb365 Ok I think I have a better understanding of what to do. I'm going to use this HTML code to create a nice looking email and table and insert my values.

I inserted what I needed and got my items. The table is still showing the previous information, probably because I didn't do something right.

This is what I have in my formula.

Concat(Gallery3.AllItems,
             "<td>" & ID  & " </td>
              <td>" & Description & " </td>
              <td>" & Qty & " </td>","</tr><tr>") &
"</table>"

Do the values have to be exactly what's named in my collection?

Or do they have to be whats named in the gallery? (ex. Text=ThisItem.ID)

How To send a gallery through email using HTML

Helpful resources

Community will be READ ONLY July 16th, 5p PDT -July 22nd

Summer of Solutions | Week 4 Results | Winners will be posted on July 24th

Check Out | 2024 Release Wave 2 Plans for Microsoft Dynamics 365 and Microsoft Power Platform

Updates to Transitions in the Power Platform Communities