cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
lyoung
Level: Powered On

Pen Input in HTML Document

Hi,

 

  I have an app that generates a Purchase Order in HTML format and then emails it out.  I can include a signature as an attachment in the email but not the body of the HTML document.  I know there are shortcuts to add the signature image to a sharepoint list and I have setup my app to collect the signature in a collection in the app.  I can go to my collections and see the image of the signature there but how do I get the image to display in the body of my HTML document instead of as an attachment?

1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
JensKofod
Level: Powered On

Re: Pen Input in HTML Document

An easy and multi-purpose solution is found to add pen-input to Sharepoint/Email/PDF/Html by utilizing the addition of a PowerApps Json functionality added on 02/05/2019.

The Short description on how to make this work is to save the pen input image in a JSON format asking the JSON function to include Binary Data:

Set( PenVar, JSON( PenInput1.Image,JSONFormat.IncludeBinaryData ) );

See here for details: https://iiu.dk/2019/10/12/powerapps-pen-input/

View solution in original post

4 REPLIES 4
Community Support Team
Community Support Team

Re: Pen Input in HTML Document

Hi @lyoung,

 

Thanks for the information.

Currently there is no direct way to have the Pen Input control to be putted into HTML control in PowerApps. We need take use of Microsoft Flow to have the image combined with the HTML, please refer to the following blogs:

Creating Printable PDF's of PowerApps screen which contain PenInput controls.

Please note: This URL contains 3rd-party sources, the content is provided AS IS, there is no guarantee of the changes/Updates.

 

The logic here is:

1. Save the image file into Azure Blob, then generate the Azure Blob image URL (which could be accessible through HTTPs after authentication ), then take use of Convert HTML to PDF action, after that, save the created PDF as an Email Attachment.

I didn't try out putting the image URL directly within the HTML format of the Email, which suppose to work as well.

Best regards,

Community Support Team _ Michael Shao
If this post helps, then please consider Accept it as the solution to help the other members find it more quickly.
lyoung
Level: Powered On

Re: Pen Input in HTML Document

Thank you @v-micsh-msft for the information but I have two issues with the solution you provided.  First is that it still requires a third party program that is not free Muhimbi and the trial is not feesible on a large scale.  Second is that we use a hybrid setup to sync Azure with our local system so there is no option to create a blob storage in Azure admin unless we are willing to pay again.  All I am trying to do is embed the signature in a document for printing purpose.  I could care less if it is email, html, word, or a PDF. It is ridiculous that this is such a difficult task to accomplish.

lyoung
Level: Powered On

Re: Pen Input in HTML Document

This works for me and it even embeds the Signature image in the body of the email...WooHoo thanks to Laura Rogers video SharePoint Power Hour: PowerApps Pen Input, Signatures

 

Solved by having a button with the OnSelect Property set to:

 

'Outlook.com'.SendEmail(
    "lyoung@weilerproducts.com",
    "New",
    "<p>
    <h2 align=""center"">Weiler Employee Gear Order Form</h2>" &
"<h3> Employee Info: </h3>" &
"<table width='100%' border='1'  cellpadding='5' style='border:1px solid black; border-collapse:collapse'> " &
     "<tr>
         <th align=""left"" cell width='20%' style='background-color:#efefef'> Order Date </th>
         <th align=""left"" cell width='20%' style='background-color:#efefef'> Employee Name </th>
         <th align=""left"" cell width='20%' style='background-color:#efefef'> Phone Number </th>
         <th align=""left"" cell width='20%' style='background-color:#efefef'> Department </th>
         <th align=""left"" cell width='20%' style='background-color:#efefef'> Managers Name </th>
     </tr>" &
     "<tr>
         <td align=""left"">"&Text(Today(),DateTimeFormat.ShortDate)&"</td>
         <td align=""left"">" & Employee_Name_Input &"</td>
         <td align=""left"">" & Phone_Number_Input & "</td>
         <td align=""left"">" & Department_Text_Box & "</td>
         <td align=""left"">" & Manager_Text_Box & "</td>
     </tr>" &
"</table>" &


"<h3> Items: </h3>" &
"<table width='100%' border='1' cellpadding='5' style='border:1px solid black; border-collapse:collapse'>" &
     "<tr style='background-color:#efefef'>
         <th cell width='20%'>Qty</th> <th width='20%'> Item # </th> <th width='20%'> Color </th><th width='20%'> Size </th><th width='20%'> Price </th>
     </tr>
     <tr>" &
         Concat(ShoppingCart,
             "<td width='20%'>" & ItemQuantity & " </td>
              <td width='20%'>" & ItemNumber & " </td>
              <td width='20%'>" & ItemColor & " </td>
              <td width='20%'>" & ItemSize & " </td>
              <td width='20%'>" & ItemCost & " </td>","</tr><tr>") &
"</table>"& "<br></br>"&

"<table  width='100%' align=""right"" cellpadding='5' border='0' style='border:0px solid white; border-collapse:collapse' >" &
     "<tr >
        <td width='20%'></td>
        <td width='20%'></td>
        <td width='20%'></td>
         <th scope=""row"" width='20%'align=""right"" >SUBTOTAL:</th>
         <td width='20%' >" &Text(Sum(ShoppingCart, ItemCost),"[$-en-US]$#,###.00") & "</td>
     </tr>

    <tr>
        <td width='20%'></td>
        <td width='20%'></td>
        <td width='20%'></td>
         <th scope=""row""  width='20%'align=""right"" >TAX (7%): </th>
         <td width='20%'>" &Text(Sum(ShoppingCart, ItemCost * "0.07"),"[$-en-US]$#,###.00") & "</td>
     </tr>

     <tr>
        <td width='20%'></td>
        <td width='20%'></td>
        <td width='20%'></td>
         <th scope=""row""   width='20%'align=""right"" >TOTAL:</th>
         <td width='20%'>" &Text(Sum(ShoppingCart, ItemCost  +  ItemCost  * "0.07"),"[$-en-US]$#,###.00") & "</td>
     </tr>

     </table>"&"<br></br>"&
     "<h3>Payment Method Selected: </h3>"
     &Payment_Method.Selected.Value &"<br></br>"& "<h3>Employee Signature: </h3>"&"<br></br>"&
    "<img src=Signature.jpg width = 200 height = 100 float=right >",
    {
        Importance: "Normal",
        Attachments: Table(
            {
                 Name: "Signature.jpg",
                 ContentBytes: Signature_Input.Image,
                 '@odata.type':""
                 }
              ),
              IsHtml: true
         }
     );
Reset(Employee_Name_Input)&Reset(Department_Text_Box)&Reset(Phone_Number_Input)&Reset(Manager_Text_Box)&Reset(Payment_Method)&Reset(Signature_Input);Clear(ShoppingCart);Navigate(BrowserScreen,None);UpdateContext({PopUp2: false})
Highlighted
JensKofod
Level: Powered On

Re: Pen Input in HTML Document

An easy and multi-purpose solution is found to add pen-input to Sharepoint/Email/PDF/Html by utilizing the addition of a PowerApps Json functionality added on 02/05/2019.

The Short description on how to make this work is to save the pen input image in a JSON format asking the JSON function to include Binary Data:

Set( PenVar, JSON( PenInput1.Image,JSONFormat.IncludeBinaryData ) );

See here for details: https://iiu.dk/2019/10/12/powerapps-pen-input/

View solution in original post

Helpful resources

Announcements
thirdimage

Power Automate Community User Group Member Badge

Fill out a quick form to claim your user group badge now!

sixthImage

Power Platform World Tour

Find out where you can attend!

Power Platform 2019 release wave 2 plan

Power Platform 2019 release wave 2 plan

Features releasing from October 2019 through March 2020

fifthimage

Microsoft Learn

Learn how to build the business apps that you need.

Top Kudoed Authors (Last 30 Days)
Users online (5,308)