Image Preview Upon User Upload

General
,
1

Hi all,

How can I display a preview of an uploaded image on the same screen when a user uploads an image?

Regards,

Upender

2

@UpenderReddyG

To display a preview of an uploaded image on the same screen, you can use the ‘Image Content’ data instances in Pega Platform. The ‘Image Preview’ field in the form contains a preview of the image and indicates the width and height of the image in pixels. After the user uploads an image into this data instance from their workstation or local area network, a message box confirms when the upload completes. Save the Image Content form to display the image preview on the same screen. Additionally, you can create a property in the case designer and select type as Attachment in the Fancy category to display the uploaded image in the section itself.

Please refer the below article:

Uploading image and displaying it to the user in UI | Support Center (pega.com)

3

@UpenderReddyG

To display a preview of an uploaded image on the same screen in Pega, follow these steps:

  1. Use ‘Image Content’ Data Instances:

    • Utilize ‘Image Content’ data instances to handle image uploads.
    • The ‘Image Preview’ field in the form displays a preview of the uploaded image, along with its dimensions (width and height in pixels).

  2. Upload and Confirmation:

    • When a user uploads an image from their workstation or local area network, a message box will confirm the successful upload.

  3. Display Image Preview:

    • Save the ‘Image Content’ form to display the image preview on the same screen.

  4. Create an Attachment Property:

    • In the Case Designer, create a property and select its type as ‘Attachment’ from the Fancy category.
    • This allows the uploaded image to be displayed directly within the section.

Thanks.