Canvas Apps Code Sample Dataverse F&SCM

How to patch images from Dataverse to D365 F&SC

Someone snapping a picture of a beautiful mountain
Someone snapping a picture of a beautiful mountain

Introduction

Patching images or, in other words, uploading images from a canvas app is a very common use case. Whether the data source is Dataverse or SharePoint, it is a functionality of many canvas apps. For the past 1 year or so, I have created several apps that connect to D365 F&SCM (formerly known as AX or F&O). One of the best ways to connect a canvas app to D365 is by using virtual entities. To learn more about virtual entities, click here.

Patching images from a Dataverse table

The setup is pretty simple:

  1. there is a record which has a bunch of related records of a table that has a column of type image.
  2. these records with images are the ones we will patch to D365

Here is a demo of the functionality, I will share the code after that:

Patching images to D365 from Dataverse
Patching images to D365 from Dataverse

The code to fetch the Dataverse image records and then to attach them to the Attachments table in D365 is as follows:

ForAll(
    colImages As ThisImage,
    Patch(
        'Sales order header document attachments V2 (mserp)',
        Defaults('Sales order header document attachments V2 (mserp)'),
        {
            'Sales order': locSelectedSalesOrder.mserp_salesordernumber,
            'Sales order headers V3': locSelectedSalesOrder,
            'File name': "Delivery receipt" & "_" & locSelectedSalesOrder.mserp_salesordernumber,
            'File type': "png",
            Type: "Delivery Receipt",
            Description: "Delivery receipt" & "_" & locSelectedSalesOrder.mserp_salesordernumber,
            'Archive file': With(
                {
                    varTempFile: JSON(
                        ThisImage.Value,
                        JSONFormat.IncludeBinaryData
                    )
                },
                Mid(
                    varTempFile,
                    Find(
                        ",",
                        varTempFile
                    ) + 1,
                    Len(varTempFile) - Find(
                        ",",
                        varTempFile
                    ) - 1
                )
            )
        }
    )
);
Patch(
    'Sales order header document attachments V2 (mserp)',
    Defaults('Sales order header document attachments V2 (mserp)'),
    {
        'Sales order': locSelectedSalesOrder.mserp_salesordernumber,
        'Sales order headers V3': locSelectedSalesOrder,
        'File name': "Customer signature" & "_" & locSelectedSalesOrder.mserp_salesordernumber,
        'File type': "png",
        Type: "Delivery Receipt",
        Description: "Customer signature" & "_" & locSelectedSalesOrder.mserp_salesordernumber,
        'Archive file': With(
            {
                varTempFile: JSON(
                    penSignature.Image,
                    JSONFormat.IncludeBinaryData
                )
            },
            Mid(
                varTempFile,
                Find(
                    ",",
                    varTempFile
                ) + 1,
                Len(varTempFile) - Find(
                    ",",
                    varTempFile
                ) - 1
            )
        )
    }
);

The key is the 'Archive file' value which is the base64 version of the image.

Patched images in D365 F&SC

This is how the images show up in D365:

The sales order
The sales order

The customer signature
The customer signature

Leave a Reply