{"id":14068,"date":"2022-01-13T07:00:00","date_gmt":"2022-01-13T12:00:00","guid":{"rendered":"https:\/\/centricconsulting.com\/post\/how-to-print-form-powerapps_portal\/"},"modified":"2022-01-13T12:39:08","modified_gmt":"2022-01-13T17:39:08","slug":"how-to-print-form-powerapps_portal","status":"publish","type":"post","link":"https:\/\/centricconsulting.com\/blog\/how-to-print-form-powerapps_portal\/","title":{"rendered":"Power Apps Tip: How to Print a Form in Power Apps"},"content":{"rendered":"

Printing in Power Apps used to require an extensive workaround, but now it’s much easier. We walk through how to print and review the workaround if you still need to use it.<\/h2>\n
\n

Back in 2018, I wrote a blog post on how to print a form in Power Apps<\/a>, which essentially involved creating an HTML report and then dumping that out into an email to print.<\/p>\n

While it wasn\u2019t very pretty, it got the job done since there wasn\u2019t a native printing support in Power Apps. Since then, Microsoft<\/a> has finally added the print ability so many people wanted. So, how does it work?<\/p>\n

Print()<\/h2>\n

That\u2019s it! It\u2019s a very simple command that takes no parameters and sends the screen off to the printer of your choice.<\/strong> In the screenshots below, I spun up a template of an app, added a \u201cPrint\u201d button, and set the \u201cOn Select Formula\u201d of the button to Print():<\/p>\n

\"Print<\/a><\/p>\n

Now, when I click that button, I am presented with a print preview of the screen where the Print button is located.<\/p>\n

\"Print<\/a><\/p>\n

While that\u2019s not very print friendly, there are also some options to allow you to customize a printable view. For instance, you could add a new screen using the built-in Print Layouts (portrait or horizontal) and then build a printable report from there.<\/strong><\/p>\n

\"Print<\/a><\/p>\n

By default, these screens come with a \u201cPrint\u201d button with the Print() command already defined. From here you can format the printed report to anything you want.<\/p>\n

\"Print<\/a><\/p>\n

While this does provide some much-needed functionality, there are some caveats to using the Print button. I\u2019m hopeful Microsoft will eventually plug these gaps in the product, as some are fairly glaring, especially the \u201ccurrently doesn\u2019t work on mobile devices\u201d limitation.<\/p>\n

\"Print<\/a><\/p>\n

How Can I Get Around Those Limitations?<\/h2>\n

Even with these limitations, there is still the option I previously wrote about. Here\u2019s a breakdown of what you need to do.<\/p>\n

I have two screens for a Power App I have built, and I want users to be able to print the form after it has been submitted. Here is what my form looks like:<\/p>\n

\"Print<\/a> \"Print<\/a><\/p>\n

It\u2019s a pretty standard form for a badge request. So, how do we get it to print? The answer lies with HTML and Microsoft Flow<\/a>.<\/strong><\/p>\n

My first step is to add a \u201cPrint Form\u201d button on the first item in my Requests Gallery. I used a simple icon for my button. Make sure you insert it into this box, so the icon ties itself to each item in the gallery.<\/p>\n

\"Print<\/a><\/p>\n

Next, you will need to generate a printable view of your form from HTML. You can use any HTML tool to do this. You can even copy and paste the HTML code from InfoPath if you are migrating a form and you had a printable view in it.<\/strong> For this example, I created a simple two-column HTML table and replaced the first column with all of my Display Names for my form. We will be adding the values for the right column in the next step. (Special thanks to html-online.com<\/a> for the easy and free HTML Generator.)<\/p>\n

\"Print<\/a><\/p>\n

Back in your Power App, insert an \u201cHTMLText Input\u201d box into the first item of your gallery, and change the Visible Property to false. For the HTMLText Property, copy and paste your HTML code between the \u201c\u201d<\/strong> (NOTE: If your HTML Code uses double quotes, do a find\/replace and replace double quotes with single quotes).<\/em><\/p>\n

We can now insert the values of the form into the second column. For example:<\/p>\n

<td style=\u2019width: 230px;\u2019><strong>Request Type<\/strong><\/td><\/strong><\/p>\n

<td>\u201d&ThisItem.Request_x0020_Type.Value &\u201d<\/td><\/strong><\/p>\n

Notice, I am coming out of the closed quotes, and then appending the current items\u2019 \u201cRequest Type Value,\u201d and then appending the other HTML again.<\/p>\n

\"Print<\/a><\/p>\n

Now, I have my HTML form which will have all of my values. Next, I will create a flow for this icon by selecting the icon, clicking the \u201cFlow\u201d button on the top toolbar, and creating a new flow for this button.<\/p>\n

\"Print<\/a><\/p>\n

I have named my button \u2018Send Printable Form,\u2019 and I will be sending the HTML in an email. Add the Outlook 365 \u201cSend an Email\u201d action and fill out the settings. The two most important things here are to make sure you use the \u201cAsk in Power Apps\u201d for the body, and change the \u201cIs HTML\u201d to \u201cYes.\u201d<\/strong><\/p>\n

\"Print<\/a><\/p>\n

Click \u201cCreate Flow,\u201d switch back to your Power App, and then click the new flow you just created to assign it to that button.<\/p>\n

\"Print<\/a><\/p>\n

In the formula bar, pass any of the variables you defined in flow. In my case, I will be sending the First Name (which will be added to the Subject) and HTMLText2.HTMLText (which is my HTML Text Box, and the HTMLText Property of that Box).<\/p>\n

\"Print<\/a><\/p>\n

Now just preview the app and click your Print button. You (or whomever was in the \u201cTo:\u201d field of your flow), will receive an email with a filled-out form that you can print.<\/p>\n

\"Print<\/a><\/p>\n

NOTE: Because this is HTML, you can customize the look and feel as much as you want.<\/em><\/p>\n

Bonus: If You Hate Printing Out of Your Email Client<\/h2>\n

You can also take that HTML content and add it to an HTML file. In my case, I saved all of the content out to an HTML file in my One Drive for Business by adding an extra step to the flow.<\/p>\n

\"Print<\/a><\/p>\n

Now when the flow runs, I can simply download and open the HTML file from my browser and print it from there.<\/p>\n

\"Print<\/a><\/p>\n

\"Print<\/a><\/p>\n

In Conclusion<\/h2>\n

I hope this is something you may find useful, especially if you have a strong need to print in Power Apps.<\/p>\n

\n

Part three of a\u00a0series<\/a>.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"

Printing in Power Apps used to require an extensive workaround, but now it’s much easier. We walk through how to print and review the workaround.<\/p>\n","protected":false},"author":86,"featured_media":33397,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_oasis_is_in_workflow":0,"_oasis_original":0,"_oasis_task_priority":"","_relevanssi_hide_post":"","_relevanssi_hide_content":"","_relevanssi_pin_for_all":"","_relevanssi_pin_keywords":"","_relevanssi_unpin_keywords":"","_relevanssi_related_keywords":"","_relevanssi_related_include_ids":"","_relevanssi_related_exclude_ids":"","_relevanssi_related_no_append":"","_relevanssi_related_not_related":"","_relevanssi_related_posts":"","_relevanssi_noindex_reason":"","footnotes":""},"categories":[1],"tags":[3758,3343],"coauthors":[15564],"acf":[],"publishpress_future_action":{"enabled":false,"date":"2024-07-21 02:17:36","action":"change-status","newStatus":"draft","terms":[],"taxonomy":"category"},"_links":{"self":[{"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/posts\/14068"}],"collection":[{"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/users\/86"}],"replies":[{"embeddable":true,"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/comments?post=14068"}],"version-history":[{"count":0,"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/posts\/14068\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/media\/33397"}],"wp:attachment":[{"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/media?parent=14068"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/categories?post=14068"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/tags?post=14068"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/centricconsulting.com\/wp-json\/wp\/v2\/coauthors?post=14068"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}