Answered

Two Columns HTML Text PowerApps

(0) Share

Report

Posted on by kess

Hi everyone! Is it possible to create two columns HTML text in PowerApps? Below is the exported PDF version of my HTML text. MY HTML text is dynamic. I tried using <div style='column-count: 2'> but doesn't seem to work. Thank you.

Here is my current HTML text code:

"<html>
<body>
<p style = 'font-family:courier new'>USD Serial List
<br>Generated By: " & ProfileName &
"<br>Date / Time: " & Now() & 

"<div style = 'column-count: 2'>
<table style = 'font-family:courier new'>
<thead><tr><th>Denomination</th><th>Serial</th></thead>
<tbody style = 'text-align:center;'>" 
& Concat(billCollection, "<tr><td>" & Substitute(NumeralDenomination,"USD ","") & "</td><td>" & SerialNumber & "</td></tr>") &
"</tbody></table><br>

<table style='font-family:courier new;'>
<thead><tr><th>Denomination</th><th>Count</th><th>Total</th></tr></thead>
<tbody style = 'text-align:center;'>" 
& Concat(billDenominationCountUser, "<tr><td>" & Substitute(Title,"USD ","") & "</td><td>" & billCountUser & "</td><td>" & Substitute(Title,"USD ","")*billCountUser & "</td></tr>") &
"</tbody></table>

<h4 style = font-family:courier new;>--------------------------<br>GRAND TOTAL: " & Concatenate("USD ", Sum(billCollection,Substitute(NumeralDenomination,"USD ",""))) &
"</h4> <br>
<p>----------------------------------------------</p>
<p style = font-family:courier new; >Client's Conforme</p>
</div>
</body>
</html>"

Categories:

Building Power Apps

I have the same question (0)

All responses (3)

Answers (1)

v-jefferni on at

Like (0)

Report

Hi @kess ,

Sorry, but I have to say it's not possible in PowerApps.

Best regards,

Was this reply helpful? Yes No
Verified answer

SolTeferi on at

Like (0)

Report
Hi @kess ,

With a little bit of HTML tricks, you can achieve the number of wraps you want the table to split into. Please try the following. Currently, it splits the table into two side by side. If you want to split it into, for example, three, just change the '2' in 'CountRows(billCollection)/2' to '3'.

With( {wraps: CountRows(billCollection) / 2}, With( { colCount: RoundUp( CountRows(billCollection) / wraps, 0 ) }, With( { colSerial: Sequence( colCount, 1, 1 ) }, "<html> <body> <p style = 'font-family:courier new'>USD Serial List <br>Generated By: " & ProfileName & "<br>Date / Time: " & Now() & Concat( ForAll( colSerial, With( { counted: LastN( FirstN( billCollection, ThisRecord.Value * wraps ), wraps ) }, "<div style='position:relative; float:left'> <table style = 'font-family:courier new; page-break-inside:auto'> <thead><tr ><th>Denomination</th><th>Serial</th></thead> <tbody style = 'text-align:center;'>" & Concat( counted, "<tr ><td>" & Substitute( NumeralDenomination, "USD ", "" ) & "</td><td>" & SerialNumber & "</td></tr>" ) & "</tbody></table></div>" ) ), Value ) ) ) )

Was this reply helpful? Yes No
SolTeferi on at

Like (0)

Report
The solution above works well. But, there is a little bug that repeats a row at the bottom a table split and at the top of the next split. So, to fix that, please, use the following updated formula, which perfectly aligns the splits side by side:
With( { wraps: RoundUp( CountRows(billCollection) / 2, 0 ) }, With( { colCount: RoundUp( CountRows(billCollection) / wraps, 0 ) }, With( { colSerial: Sequence( colCount, 1, 1 ) }, "<html> <body> <p style = 'font-family:courier new'>USD Serial List <br>Generated By: " & ProfileName & "<br>Date / Time: " & Now() & Concat( ForAll( colSerial, With( {seq: ThisRecord.Value}, With( { counted: LastN( FirstN( billCollection, seq * wraps ), If( seq = CountRows(colSerial), CountRows(billCollection) - (seq - 1)*wraps, wraps ) ) }, "<div style='position:relative; float:left'> <table style = 'font-family:courier new; page-break-inside:auto'> <thead><tr ><th>Denomination</th><th>Serial</th></thead> <tbody style = 'text-align:center;'>" & Concat( counted, "<tr ><td>" & Substitute( NumeralDenomination, "USD ", "" ) & "</td><td>" & SerialNumber & "</td></tr>" ) & "</tbody></table></div>" ) ) ), Value ) ) ) )

Was this reply helpful? Yes No