Populating HTML in PowerApps from template in SharePoint list

[BellatrixUAM]

Hello all,

I'm trying to create an app where users can see announcements. The announcements are sent to us in HTML format, so I created a list in SharePoint with Subject and Body columns. The Body column is formatted as Enhanced Rich Text, so I pasted the HTML code in here.

In PowerApps, I created Gallery1 that shows the Subject and Created date for the announcement, and Gallery2 with an HTML Text box with Gallery1.Selected.Body in the Text Property. 

The idea is for PowerApps to "read" the code on Gallery2 depending on what announcement you select in Gallery1, and therefore, to display the announcement as you may see it in Outlook, for example. But right now, is just displaying the HTML text in the SharePoint list, and is not reading the code.

HTML code in Body column in SharePoint list:

<p style="text-align: center;"><img src="https://xxxxx.xxxx-xxxx.com/:i:/r/sites/XXXXxxxxxxx/communications/Shared%20Documents/Images%20for%2..." alt="" width="288" height="160" /></p>
<p style="text-align: center;">&nbsp;</p>
<p><strong>Congratulations! This is a test.</strong></p>
<p>&nbsp;</p>
<p>Announcements are sent in HTML format by our design company and therefore, the code should be read by PowerApps from a SharePoint list as its main source.</p>
<p>&nbsp;</p>
<p><span style="color: #ff0000;"><strong>Thank you and good luck!</strong></span></p>

SharePoint List:

How it looks in PowerApps right now:

How it should look Gallery2 in PowerApps:

Thank you so much for all your help!

[WarrenBelz]

Hi @BellatrixUAM ,

You need single quotes for HTML code

"<p style='text-align: center;'><img src='https://xxxxx.xxxx-xxxx.com/:i:/r/sites/XXXXxxxxxxx/communications/Shared%20Documents/Images%20for%2...' alt='' width='288' height='160' /></p>
<p style='text-align: center';>&nbsp;</p>
<p><strong>Congratulations! This is a test.</strong></p>
<p>&nbsp;</p>
<p>Announcements are sent in HTML format by our design company and therefore, the code should be read by PowerApps from a SharePoint list as its main source.</p>
<p>&nbsp;</p>
<p><span style='color: #ff0000;'><strong>Thank you and good luck!</strong></span></p>"

I do not have your image, but the rest works fine.

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

[BellatrixUAM]

Hi @WarrenBelz 

I added the single quotes to the HTML code in the Body column of the SharePoint List and still is not working.

This is how is being displayed in Power Apps:

[WarrenBelz]

Hi @BellatrixUAM ,

Can you please post that code in Text - I can still see a heap of double quotes in there.

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

[BellatrixUAM]

Hi @WarrenBelz 

The code I used and added in the Body column of SharePoint list is:

'<p><strong>Congratulations! This is a test.</strong></p>
<p>&nbsp;</p>
<p>Announcements are sent in HTML format by our design company and therefore, the code should be read by PowerApps from a SharePoint list as its main source.</p>
<p>&nbsp;</p>
<p><span style="color: #ff0000;"><strong>Thank you and good luck!</strong></span></p>'

I took the picture off because I do not want to over complicate this. 

This is how it looks in SharePoint:

And this is how it looks in PowerApps:

Thank you!

[WarrenBelz]

Hi @BellatrixUAM ,

You need the double quotes enclosing it to signify it is text and single inside

"<p><strong>Congratulations! This is a test.</strong></p>
<p>&nbsp;</p>
<p>Announcements are sent in HTML format by our design company and therefore, the code should be read by PowerApps from a SharePoint list as its main source.</p>
<p>&nbsp;</p>
<p><span style='color: #ff0000;'><strong>Thank you and good luck!</strong></span></p>"

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

[BellatrixUAM]

Hi @WarrenBelz 

I'm sorry but I'm not get it. I tried with double quotes first by putting them in the code in the sharepoint column, still it was not read in the HTML in PowerApps. Then, you told me it should be single quotes, so I changed it and put them in the code in the SharePoint list, still as per my previous screenshots, PowerApps is not recognizing it.

So now... should I put double quotes again? Should I put them in the SharePoint list column directly like "<p><strong>Congratulations! This is a test.</strong></p>
<p>&nbsp;</p>..."

Or should I put the double quotes directly in PowerApps like "&Gallery2.Selected.Body&"

I appreciate your clarification.

[WarrenBelz]

@BellatrixUAM ,

Can you please look at the code I posted both times. The whole code needs to be enclosed in double quotes (at the start and end only) as it is a text string. Howeveranywhere double quotes would normally be used inside the HTML code (around the Color in this case)

<p><span style='color: #ff0000;'><strong>Thank you and good luck!</strong></span></p>

needs to be single quotes.

You also had a number of others in your original post

<p style='text-align: center;'>
<img src='https://xxxxx.xxxxxxxx.com/:i:/r/sites/XXXXxxxxxxx/communications/Shared%20Documents/Images%20for%2...' alt='' width='288' height='160' /></p>
<p style='text-align: center';>&nbsp;</p>

If you simply paste the code I provided in the first one, it should work for you.

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

[BellatrixUAM]

Hello @WarrenBelz 

I did that, and still is not working:

I changed the text code to: 

"<p><strong>Congratulations! This is a test.</strong></p>
<p>&nbsp;</p>
<p>Announcements are sent in HTML format by our design company and therefore, the code should be read by PowerApps from a SharePoint list as its main source.</p>
<p>&nbsp;</p>
<p><span style='color: #ff0000;'><strong>Thank you and good luck!</strong></span></p>"

🤔

[WarrenBelz]

Hi @BellatrixUAM ,

I assume you are putting this is a HTML Text box - please see below

Here is is below in HTML in the post itself

Congratulations! This is a test

Announcements are sent in HTML format by our design company and therefore, the code should be read by PowerApps from a SharePoint list as its main source

Thank you and good luck!

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.