I am trying to export the records of the Sharepoint list , when an item is created or modified , the output result is ok but the output data format is not looking, I need the looks as below:
I used the below Html code , which I found from website search
<style>
Table {
font-family: Arial, Helvetica, sans-serif;
background-color: #EEEEEE;
border-collapse: collapse;
width: 100%;
}
Table td, Table th {
border: 1px solid #ddd;
padding: 3px 3px;
}
Table th {
font-size: 15px;
font-weight: bold;
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #1C6EA4;
color: white;
}
</style>
But it not formatting properly and also it is getting mess with my auto signature
My Flow is as below:
Kindly check and advise
Solved! Go to Solution.
Hi @MIA27 ,
Do you want to generate a multi-row, two-column HTML table with borders based on the current item and send it by email?
I have made a simple test for your reference.
Here is my Flow.
<!DOCTYPE html>
<html>
<head>
<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;
}
td:nth-child(odd) {
background-color: #dddddd;
}
</style>
</head>
<body>
<table>
<tr>
<td>ColumnName1</td>
<td>DynamicContent1</td>
</tr>
<tr>
<td>ColumnName2</td>
<td>DynamicContent2</td>
</tr>
<tr>
<td>ColumnName3</td>
<td>DynamicContent3</td>
</tr>
<tr>
<td>ColumnName4</td>
<td>DynamicContent4</td>
</tr>
<tr>
<td>ColumnName5</td>
<td>DynamicContent5</td>
</tr>
</table>
</body>
</html>
Result Screenshot:
Best Regards,
Charlie Choi
Hi @MIA27 ,
Maybe you could try the following Codes. I used class attribute in code.
<!DOCTYPE html>
<html>
<head>
<style>
table.tb1 {
border: 1px solid #1C6EA4;
background-color: #EEEEEE;
text-align: left;
border-collapse: collapse;
}
table.tb1 td, table.tb1 th {
border: 1px solid #AAAAAA;
padding: 3px 2px;
}
table.tb1 td {
width: 25%;
}
table.tb1 td:nth-child(odd) {
background-color: #dddddd;
}
</style>
</head>
<body>
<table class="tb1">
<tr>
<td>ColumnName1</td>
<td>DynamicContent1</td>
</tr>
<tr>
<td>ColumnName2</td>
<td>DynamicContent2</td>
</tr>
<tr>
<td>ColumnName3</td>
<td>DynamicContent3</td>
</tr>
<tr>
<td>ColumnName4</td>
<td>DynamicContent4</td>
</tr>
<tr>
<td>ColumnName5</td>
<td>DynamicContent5</td>
</tr>
</table>
</body>
</html>
Best Regards,
Charlie Choi
Hi @MIA27 ,
The HTML table generated by the code I provided earlier should have borders. in addition, here is the latest code:
<!DOCTYPE html>
<html>
<head>
<style>
table.tb1 {
border: 1px solid #1C6EA4;
background-color: #EEEEEE;
text-align: left;
border-collapse: collapse;
}
table.tb1 td, table.tb1 th {
border: 1px solid #AAAAAA;
padding: 3px 2px;
}
table.tb1 td {
width: 25%;
}
.td1 {
background-color: #1C6EA4;
text-align:center;
color:#FFFFFF
}
</style>
</head>
<body>
<table class="tb1">
<tr>
<td class="td1">ID</td>
<td>TestValue1</td>
</tr>
<tr>
<td class="td1">Title</td>
<td>TestValue2</td>
</tr>
<tr>
<td class="td1">Product Description</td>
<td>TestValue3</td>
</tr>
<tr>
<td class="td1">Qty</td>
<td>TestValue4</td>
</tr>
<tr>
<td class="td1">Status</td>
<td>TestValue5</td>
</tr>
</table>
</body>
</html>
Result Screenshot:
Best Regards,
Charlie Choi
Hi @MIA27 ,
Your HTML Code looks fine.
In addition, do you want to improve the readability of your code in your post? If so, you could paste the code in the code box.
<!DOCTYPE html>
<html>
<head>
<style>
Best Regards,
Charlie Choi
Hi @MIA27 ,
Here are some links that might help you:
https://www.w3schools.com/html/html_tables.asp
https://www.w3schools.com/html/html_css.asp
https://www.w3schools.com/html/html_styles.asp
https://www.w3schools.com/html/html_classes.asp
Best Regards,
Charlie Choi
@MIA27 Use this style-
<style>
Table {
font-family: Arial, Helvetica, sans-serif;
background-color: #EEEEEE;
border-collapse: collapse;
}
Table td, Table th {
border: 1px solid #ddd;
padding: 3px 3px;
text-align: center;
}
Table th {
font-size: 15px;
font-weight: bold;
padding-top: 12px;
padding-bottom: 12px;
}
</style>
Please 'Thumbs Up' the posts that helped you and 'Accept as Solution' if my post answered your question.
Dear Mr. Haresh,
Thank you for your reply.
In my situation it is not getting applied.
Reason what I can understand that code is ok, but for me as the my IT people has set up auto signature which is creating the mess of my email, the code is trying to format the signature section also.
Therefore, change the plan and send the records one by one.
so applied the below method,
Is it possible to format the below email style, if yes please guide
My current requirement will be as below
Hi @MIA27 ,
Do you want to generate a multi-row, two-column HTML table with borders based on the current item and send it by email?
I have made a simple test for your reference.
Here is my Flow.
<!DOCTYPE html>
<html>
<head>
<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;
}
td:nth-child(odd) {
background-color: #dddddd;
}
</style>
</head>
<body>
<table>
<tr>
<td>ColumnName1</td>
<td>DynamicContent1</td>
</tr>
<tr>
<td>ColumnName2</td>
<td>DynamicContent2</td>
</tr>
<tr>
<td>ColumnName3</td>
<td>DynamicContent3</td>
</tr>
<tr>
<td>ColumnName4</td>
<td>DynamicContent4</td>
</tr>
<tr>
<td>ColumnName5</td>
<td>DynamicContent5</td>
</tr>
</table>
</body>
</html>
Result Screenshot:
Best Regards,
Charlie Choi
Dear Charlie,
Thank you for your advise code, it worked, but it is applying the formatting on the signature also.
Kindly below note in the image posted
My IT teams has set the auto signature for every new email, which I cannot remove also to test it.
I dont want the format to be applied on the below signature and Also the width to be controlled as it is on the whole page,
Please guide how to solve both:
Hi @MIA27 ,
Maybe you could try the following Codes. I used class attribute in code.
<!DOCTYPE html>
<html>
<head>
<style>
table.tb1 {
border: 1px solid #1C6EA4;
background-color: #EEEEEE;
text-align: left;
border-collapse: collapse;
}
table.tb1 td, table.tb1 th {
border: 1px solid #AAAAAA;
padding: 3px 2px;
}
table.tb1 td {
width: 25%;
}
table.tb1 td:nth-child(odd) {
background-color: #dddddd;
}
</style>
</head>
<body>
<table class="tb1">
<tr>
<td>ColumnName1</td>
<td>DynamicContent1</td>
</tr>
<tr>
<td>ColumnName2</td>
<td>DynamicContent2</td>
</tr>
<tr>
<td>ColumnName3</td>
<td>DynamicContent3</td>
</tr>
<tr>
<td>ColumnName4</td>
<td>DynamicContent4</td>
</tr>
<tr>
<td>ColumnName5</td>
<td>DynamicContent5</td>
</tr>
</table>
</body>
</html>
Best Regards,
Charlie Choi
Dear Charlie,
Thank you so much,
it worked. Below is the image of the output in email. For testing I only inserted the Dynamic field only.
But One additional advise to show perfection in the output and learn more (which will help me to apply in other flows also), Is it possible to put border and font colors in the output as it not good readable and getting mixed.
Current output in email
Required is the below output to bring good looks (some formatting also please note background color, font color, allignement etc)
Best Regards.
Hi @MIA27 ,
The HTML table generated by the code I provided earlier should have borders. in addition, here is the latest code:
<!DOCTYPE html>
<html>
<head>
<style>
table.tb1 {
border: 1px solid #1C6EA4;
background-color: #EEEEEE;
text-align: left;
border-collapse: collapse;
}
table.tb1 td, table.tb1 th {
border: 1px solid #AAAAAA;
padding: 3px 2px;
}
table.tb1 td {
width: 25%;
}
.td1 {
background-color: #1C6EA4;
text-align:center;
color:#FFFFFF
}
</style>
</head>
<body>
<table class="tb1">
<tr>
<td class="td1">ID</td>
<td>TestValue1</td>
</tr>
<tr>
<td class="td1">Title</td>
<td>TestValue2</td>
</tr>
<tr>
<td class="td1">Product Description</td>
<td>TestValue3</td>
</tr>
<tr>
<td class="td1">Qty</td>
<td>TestValue4</td>
</tr>
<tr>
<td class="td1">Status</td>
<td>TestValue5</td>
</tr>
</table>
</body>
</html>
Result Screenshot:
Best Regards,
Charlie Choi
I copied the complete final code from your last posting, I tested the code, all the fine other than border, no border, but in image border is there.
please advise which line to revise, so that the border can appear.
Regards
Dear Charlie,
Further to not 100% result, started tested and adding lines. As I am very new to this coding, after making mess codes, found the below code worked and brought the result as I wanted.
But I am fully sure, that I have added few extra lines which may can be revised to be better.
The additional method I applied, that I added one more class .td2 as you did to capture the value of column related rows and some padding code as well. Not sure If I am ok and there will no further code failure later.
Requesting you to review my code and advise me, it help me to learn and use in further need.
Applied code is as below :
<!DOCTYPE html> |
<html> |
<head> |
<style> |
table.tb1 { |
border: 1px solid #1C6EA4; |
background-color: #B2B2B2; |
text-align: left; |
font-size:15px; |
font-family:calibri; |
padding: 3px 2px; |
} |
table.tb1 td, table.tb1 th { |
border: 1px solid #1C6EA4; |
padding: 3px 2px; |
} |
table.tb1 td { |
width: 25%; |
} |
.td1 { |
background-color: #1C6EA4; |
text-align:center; |
color:#FFFFFF |
} |
.td2 { |
background-color: rgb(255,255,255); |
text-align:left; |
color:Black |
} |
</style> |
</head> |
<body> |
<table class="tb1"> |
<tr> |
<td class="td1">FormNo :</td> |
<td class="td2">TestValue1</td> |
</tr> |
<tr> |
<td class="td1">Model :</td> |
<td class="td2">TestValue2</td> |
</tr> |
<tr> |
<td class="td1">SerialNo :</td> |
<td class="td2">TestValue3</td> |
</tr> |
<tr> |
<td class="td1">ProdType :</td> |
<td class="td2">TestValue4</td> |
</tr> |
<tr> |
<td class="td1">AssetNo :</td> |
<td class="td2">TestValue5</td> |
</tr> |
</table> |
</body> |
</html> |
The result is as below:
sorry,
I added to my reply to earlier reply.
Should I clicked on your post to reply.
anyhow, please check the trailing post and advise.
Also plls. advise where to type these codes when copied and pasted in compose it remains same colors coding, same as yours.
Best regards.
Hi @MIA27 ,
Your HTML Code looks fine.
In addition, do you want to improve the readability of your code in your post? If so, you could paste the code in the code box.
<!DOCTYPE html>
<html>
<head>
<style>
Best Regards,
Charlie Choi
Dear Charlie,
Thank you so much for your review and advise, which is helping to learn more.
I applied the code in my project.
Can you please guide any link where I can learn more about the html related to table.
I saw some, formatting of tables is also there.
But from you I learn the declaration of class and then linking it later in the lower code.
Was looking, some tutorials links, where these types code with example are there, this will help me to learn more and understand each lines of the code before writing.
Thanking you once for time.
Best regards
Hi @MIA27 ,
Here are some links that might help you:
https://www.w3schools.com/html/html_tables.asp
https://www.w3schools.com/html/html_css.asp
https://www.w3schools.com/html/html_styles.asp
https://www.w3schools.com/html/html_classes.asp
Best Regards,
Charlie Choi
Thank you Sir,
Best Regards.
Super Users – 2023 Season 1 We are excited to kick off the Power Users Super User Program for 2023 - Season 1. The Power Platform Super Users have done an amazing job in keeping the Power Platform communities helpful, accurate and responsive. We would like to send these amazing folks a big THANK YOU for their efforts. Super User Season 1 | Contributions July 1, 2022 – December 31, 2022 Super User Season 2 | Contributions January 1, 2023 – June 30, 2023 Curious what a Super User is? Super Users are especially active community members who are eager to help others with their community questions. There are 2 Super User seasons in a year, and we monitor the community for new potential Super Users at the end of each season. Super Users are recognized in the community with both a rank name and icon next to their username, and a seasonal badge on their profile. Power Apps Power Automate Power Virtual Agents Power Pages Pstork1* Pstork1* Pstork1* OliverRodrigues BCBuizer Expiscornovus* Expiscornovus* ragavanrajan AhmedSalih grantjenkins renatoromao Mira_Ghaly* Mira_Ghaly* Sundeep_Malik* Sundeep_Malik* SudeepGhatakNZ* SudeepGhatakNZ* StretchFredrik* StretchFredrik* 365-Assist* 365-Assist* cha_cha ekarim2020 timl Hardesh15 iAm_ManCat annajhaveri SebS Rhiassuring LaurensM abm TheRobRush Ankesh_49 WiZey lbendlin Nogueira1306 Kaif_Siddique victorcp RobElliott dpoggemann srduval SBax CFernandes Roverandom schwibach Akser CraigStewart PowerRanger MichaelAnnis subsguts David_MA EricRegnier edgonzales zmansuri GeorgiosG ChrisPiasecki ryule AmDev fchopo phipps0218 tom_riha theapurva takolota Akash17 momlo BCLS776 Shuvam-rpa rampprakash ScottShearer Rusk ChristianAbata cchannon Koen5 a33ik AaronKnox Matren Alex_10 Jeff_Thorpe poweractivate Ramole DianaBirkelbach DavidZoon AJ_Z PriyankaGeethik BrianS StalinPonnusamy HamidBee CNT Anonymous_Hippo Anchov KeithAtherton alaabitar Tolu_Victor KRider sperry1625 IPC_ahaas zuurg rubin_boer cwebb365 If an * is at the end of a user's name this means they are a Multi Super User, in more than one community. Please note this is not the final list, as we are pending a few acceptances. Once they are received the list will be updated.
Welcome to our March 2023 Newsletter, where we'll be highlighting the great work of our members within our Biz Apps communities, alongside the latest news, video releases, and upcoming events. If you're new to the community, be sure to subscribe to the News & Announcements and stay up to date with the latest news from our ever-growing membership network who find real "Power in the Community". LATEST NEWS Power Platform Connections Check out Episode Five of Power Platform Connections, as David Warner II and Hugo Bernier chat with #PowerAutomate Vice President, Stephen Siciliano, alongside reviewing out the great work of Vesa Juvonen, Waldek Mastykarz, Maximilian Müller, Kristine Kolodziejski, Danish Naglekar, Cat Schneider, Victor Dantas, and many more. Use the hashtag #PowerPlatformConnects on social media for a chance to have your work featured on the show! Did you miss an episode? Catch up now in the Community Connections Galleries Power Apps, Power Automate, Power Virtual Agents, Power Pages Power Platform leading a new era of AI-generated low-code development. **HOT OFF THE PRESS** Fantastic piece here by Charles Lamanna on how we're reinventing software development with Copilot in Power Platform to help you can build apps, flows, and bots with just a simple description! Click here to see the Product Blog Copilot for Power Apps - Power CAT Live To follow on from Charles' blog, check out #PowerCATLive as Phil Topness gives Clay Wesener Wesner a tour of the capabilities of Copilot in Power Apps. UPCOMING EVENTS Modern Workplace Conference Check out the Power Platform and Microsoft 365 Modern Workplace Conference that returns face-to-face at the Espace St Martin in Paris on 27-28th March. The #MWCP23 will feature a wide range of expert speakers, including Nadia Yahiaoui, Amanda Sterner, Pierre-Henri, Chirag Patel, Chris Hoard, Edyta Gorzoń, Erika Beaumier, Estelle Auberix, Femke Cornelissen, Frank POIREAU, Gaëlle Moreau, Gilles Pommier, Ilya Fainberg, Julie Ecolivet, Mai-Lynn Lien, Marijn Somers, Merethe Stave, Nikki Chapple, Patrick Guimonet, Penda Sow, Pieter Op De Beéck, Rémi Riche, Robin Doudoux, Stéphanie Delcroix, Yves Habersaat and many more. Click here to find out more and register today! Business Applications Launch 2023 Join us on Tuesday 4th April 2023 for an in-depth look into the latest updates across Microsoft Power Platform and Microsoft Dynamics 365 that are helping businesses overcome their biggest challenges today. Find out about new features, capabilities, and best practices for connecting data to deliver exceptional customer experiences, collaborating and creating using AI-powered capabilities, driving productivity with automation, and building future growth with today’s leading technology. Click Here to Register Today! Power Platform Conference 2023 We are so excited to see you for the Microsoft Power Platform Conference in Las Vegas October 3-5th, 2023! But first, let's take a look below at some fun moments from MPPC 2022 in Orlando Florida. 2023 sees guest speakers such as Charles Lamanna, Heather Cook, Julie Strauss, Nirav Shah, Ryan Cunningham, Sangya Singh, and many more taking part, so why not click the link below to register for the #PowerPlatformConf today! Vegas, baby! Click Here to Register Today! COMMUNITY HIGHLIGHTS Check out our top Super and Community Users reaching new levels! These hardworking members are posting, answering questions, kudos, and providing top solutions in their communities. Power Apps: Super Users: @WarrenBelz | @iAm_ManCat Community Users: @LaurensM | @Rusk | @RJM07 Power Automate: Super Users: @abm | @Expiscornovus | @RobElliott Community Users: @grantjenkins | @Chriddle Power Virtual Agents: Super Users: @Expiscornovus | @Pstork1 Community Users: @MisterBates | @Jupyter123 | Kunal K Power Pages: Super Users: @OliverRodriguesOliverRodrigues | @Mira_Ghaly Community Users: @FubarFubar | @ianwukianwuk LATEST PRODUCT BLOG ARTICLES Power Apps Community Blog Power Automate Community Blog Power Virtual Agents Community Blog Power Pages Community Blog Check out 'Using the Community' for more helpful tips and information: Power Apps, Power Automate, Power Virtual Agents, Power Pages
Join us for an in-depth look into the latest updates across Microsoft Dynamics 365 and Microsoft Power Platform that are helping businesses overcome their biggest challenges today. Find out about new features, capabilities, and best practices for connecting data to deliver exceptional customer experiences, collaborating, and creating using AI-powered capabilities, driving productivity with automation—and building towards future growth with today’s leading technology. Microsoft leaders and experts will guide you through the full 2023 release wave 1 and how these advancements will help you: Expand visibility, reduce time, and enhance creativity in your departments and teams with unified, AI-powered capabilities.Empower your employees to focus on revenue-generating tasks while automating repetitive tasks.Connect people, data, and processes across your organization with modern collaboration tools.Innovate without limits using the latest in low-code development, including new GPT-powered capabilities. Click Here to Register Today!
Episode Five of Power Platform Connections sees David Warner and Hugo Bernier talk to Vice President of Power Automate, Stephen Siciliano, alongside the latest news, product reviews, and community blogs. Use the hashtag #PowerPlatformConnects on social media for a chance to have your work featured on the show! Show schedule in this episode: 0:00 Cold Open 0:34 Show Intro 01:09 Stephen Siciliano Interview 30:42 Blogs & Articles 31:06 PnP Weekly Ep 200 32:51 SharePoint Custom Form Backup 33:38 Power Apps Extreme Makeover 34:56 ChatGPT Control 35:35 Color Data 37:17 Top 7 Features on Dynamics 365 2023 Release Wave 1 38:30 Outro & Bloopers Check out the blogs and articles featured in this week’s episode: https://pnp.github.io/blog/microsoft-365-pnp-weekly/episode-200/ (no tags) https://grazfuchs.net/post/sharepoint-customform-backup/ @Maximilian Müllerhttps://www.fromzerotoheroes.com/ @Kristine Kolodziejski https://github.com/Power-Maverick/PCF-Controls/tree/master/ChatGPTControl @DanzMaverick https://yerawizardcat.com/color/ @CatSchneider https://events.powercommunity.com/dynamics-power-israel/ @VictorDantas Action requested: Feel free to provide feedback on how we can make our community more inclusive and diverse. This episode premiered live on our YouTube at 12pm PST on Thursday, 16th March 2023. Video series available at Power Platform Community YouTube channel. Upcoming events: Business Applications Launch – April 4th – Free and Virtual! M365 Conference - May 1-5th - Las Vegas Power Apps Developers Summit – May 19-20th - London European Power Platform conference – Jun. 20-22nd - Dublin Microsoft Power Platform Conference – Oct. 3-5th - Las Vegas Join our Communities: Power Apps Community Power Automate Community Power Virtual Agents Community Power Pages Community If you’d like to hear from a specific community member in an upcoming recording and/or have specific questions for the Power Platform Connections team, please let us know. We will do our best to address all your requests or questions.
We are excited to share the ‘Power Platform Communities Front Door’ experience with you! Front Door brings together content from all the Power Platform communities into a single place for our community members, customers and low-code, no-code enthusiasts to learn, share and engage with peers, advocates, community program managers and our product team members. There are a host of features and new capabilities now available on Power Platform Communities Front Door to make content more discoverable for all power product community users which includes ForumsUser GroupsEventsCommunity highlightsCommunity by numbersLinks to all communities Users can see top discussions from across all the Power Platform communities and easily navigate to the latest or trending posts for further interaction. Additionally, they can filter to individual products as well. Users can filter and browse the user group events from all power platform products with feature parity to existing community user group experience and added filtering capabilities. Users can now explore user groups on the Power Platform Front Door landing page with capability to view all products in Power Platform. Explore Power Platform Communities Front Door today. Visit Power Platform Community Front door to easily navigate to the different product communities, view a roll up of user groups, events and forums.
We are so excited to see you for the Microsoft Power Platform Conference in Las Vegas October 3-5 2023! But first, let's take a look back at some fun moments and the best community in tech from MPPC 2022 in Orlando, Florida. Featuring guest speakers such as Charles Lamanna, Heather Cook, Julie Strauss, Nirav Shah, Ryan Cunningham, Sangya Singh, Stephen Siciliano, Hugo Bernier and many more. Register today: https://www.powerplatformconf.com/
User | Count |
---|---|
15 | |
15 | |
14 | |
9 | |
8 |
User | Count |
---|---|
27 | |
25 | |
23 | |
21 | |
17 |