cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
hagru
Advocate II
Advocate II

Displaying an image in Dynamics Form

Hello!

 

I am building a Model Driven PowerApp that is keeping track of players in my club. I am saving images as URLs, and would like to display them in the Player Form. Is this possible?

 

hagru_0-1719228546365.png

 

As you can see in the right column, I have an image URL. I would like to display it as an image instead of the URL.

6 REPLIES 6

Hi @hagru

 

To display images in a Model Driven PowerApp form using URLs, follow these steps:

 

Enable Image Field:
In your Model Driven App, navigate to the form where you want to display the image.
Open the form properties.
Look for the option to “Show image in the form” and enable it.
Image Field Configuration:
Add an image field to your entity (table) in the Dataverse.
This field will store the image URLs.
Form Design:
Edit your form and add the image field to the form layout.
Bind the image field to the appropriate data source (the image URL field).
Display Images:
When you view a record in the form, the image field will display the image corresponding to the URL stored in your data.

 

Remember to adjust the field names and settings according to your specific app and data structure. This approach allows you to display images directly within the form.

 

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

Sunil Pashikanti - Tech Blog: PowerApps

 

 

Hello @SunilPashikanti!

 

I tried this before posting, and I tried again now after reading your reply, but the result remains the same. Here is my process:

 

I verify that the "Show image" checkbox is checked under Form Properties, and I add an image field to the Player table.

I add the field to the form in my app, open the datacard and the Image element, where I insert the image URL, as shown in the picture below:

hagru_0-1719310928035.png

 

The picture is displayed, albeit under a blue button saying "Add image" or something similar, and I'm thinking this looks good, until I try submitting the form, when nothing happens.

 

I checked the activity monitor, and it says I get an unexpected error. I'll add a picture of that below. Upon removing the image field from the form, I am able to submit forms again.

 

hagru_1-1719311137286.png

 

The patch request payload is successful, but the two others fail, causing the whole form submit to break.

 

I know the setting in form properties say that it displays the primary image of the table, does it matter if the single image field I have is marked as Primary Image or not? And does it matter if I check the "Can store entire image" on the image field or not?

 

Not quite sure what is going wrong.

 

 

Hi @hagru

 

Here are some steps to consider:

Image Field Configuration:
Ensure that you’ve correctly added an image field to your entity (table) in the Dataverse.
The field should store the image URLs.
Verify that the field is properly bound to the appropriate data source (the image URL field).
Form Properties:
In the form properties, make sure you’ve enabled the option to “Show image in the form.”
If you’re using an image field, it should display the image corresponding to the URL stored in your data.
Primary Image Setting:
The “Primary Image” setting in form properties refers to the primary image associated with the record.
If you’re using a separate image field, it doesn’t necessarily need to be marked as the primary image.
The “Can store entire image” option determines whether the field can store the entire image or just a URL. If you’re storing URLs, you can leave this unchecked.
Unexpected Error:
Common issues could be related to permissions, data validation, or incorrect field mappings.
Patch Request:
Since the patch request payload is successful, focus on the other two requests that fail.
Double-check the data source and ensure that the image URL field is correctly referenced in your patch requests.
Testing:
Temporarily remove the image field from the form and test form submission. If it works without the image field, it might help narrow down the issue.
Consider testing with a different image URL to rule out any specific issues with the current image.

 

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

Sunil Pashikanti - Tech Blog: PowerApps

 

Hello @SunilPashikanti 

 

I have confirmed that I have added an image field to my table. I have tried two fields, one where the "Can store entire image" is checked, and one where it is not checked. Both of them seems to store the full image in the table if I upload an image to the field and submit it. Or at least it looks that way in the overview of the records. I am unable to edit the column on the record in that view of rows.

 

If I click and add a picture to the form field, it uploads the picture. I can see the picture in the table and in the player form where I want to display it. However, I don't want to store the actual image, just the URL. Why do I want to do it this way? Because I get the image URLs from an API. They are easy to store in a URL field, but then I can't display them in the Player Form, which is what I want to do.

 

When you say "bound to the appropriate data source (the image URL field)", what does that mean exactly? I have the form in my app where I add the field. I have tried changing different properties in the "Image" part of the datacard that is added to different image URLs, but whenever I do that and try to submit the form, I get errors.

Hi @hagru

 

Storing image URLs in a URL field while displaying them in a Model-Driven app form can be a bit tricky:

Image Web Resources:
Navigate to the form editor for your table.
Choose where you want to add the image in the form.
On the Insert tab, select Web Resource.
On the General tab, choose the web resource image (which should be the image URL) that you want to add.
Specify a name for the web resource, and you can also provide a label and alternative text.
Binding to the Appropriate Data Source:
When I mention “bound to the appropriate data source,” I mean connecting the image control (such as an Image component) in your form to the actual data field that holds the image URL.
In your form, make sure the image control is bound to the field where you store the image URL. This ensures that the image displayed is dynamically linked to the data in your table.
If you’re using a data card for the image, set its properties (such as the Image property) to reference the correct field containing the URL.
Troubleshooting Errors:
If you encounter errors when submitting the form, double-check the following:
Ensure that the data source (table) has the correct field for storing image URLs.
Verify that the data card properties (such as Image) are correctly configured to use the URL field.
Confirm that the image URLs retrieved from your API are valid and accessible.
Test the form with a sample record to see if the image displays as expected.

 

Image web resources (model-driven apps) - Power Apps | Microsoft Learn

How to show an image on Model-Driven app form - Power Platform Community (microsoft.com)

Let’s show an image on the Power Apps Portal form, too – It Ain't Boring (itaintboring.com)

 

Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.

Sunil Pashikanti - Tech Blog: PowerApps

Hello again @SunilPashikanti 

I appreciate your patience with me here, but I still can't seem to figure it out.

I have a table field called "Image_URL" that I have set to datatype "URL". When I add a player, I get the image URL from an API, and store it in this field. This is the image I would like to display in my model driven form.

 

I'm unable to store URLs in Image fields in Dataverse, and I am not sure how to bind the Web Resource to display the URL saved in my Image URL field. Some screenshots of the process would be very much appreciated. 

 

If it is not necessary to save the image in the PowerApps form I am submitting, then I would like to avoid that. I get a URL that I save to the Image URL field, this is the URL of the picture I want to display in the form I added as a screenshot in my initial post.

Helpful resources

Announcements

Community will be READ ONLY July 16th, 5p PDT -July 22nd

Dear Community Members,   We'd like to let you know of an upcoming change to the community platform: starting July 16th, the platform will transition to a READ ONLY mode until July 22nd.   During this period, members will not be able to Kudo, Comment, or Reply to any posts.   On July 22nd, please be on the lookout for a message sent to the email address registered on your community profile. This email is crucial as it will contain your unique code and link to register for the new platform encompassing all of the communities.   What to Expect in the New Community: A more unified experience where all products, including Power Apps, Power Automate, Copilot Studio, and Power Pages, will be accessible from one community.Community Blogs that you can syndicate and link to for automatic updates. We appreciate your understanding and cooperation during this transition. Stay tuned for the exciting new features and a seamless community experience ahead!

Summer of Solutions | Week 4 Results | Winners will be posted on July 24th

We are excited to announce the Summer of Solutions Challenge!   This challenge is kicking off on Monday, June 17th and will run for (4) weeks.  The challenge is open to all Power Platform (Power Apps, Power Automate, Copilot Studio & Power Pages) community members. We invite you to participate in a quest to provide solutions in the Forums to as many questions as you can. Answers can be provided in all the communities.    Entry Period: This Challenge will consist of four weekly Entry Periods as follows (each an “Entry Period”)   - 12:00 a.m. PT on June 17, 2024 – 11:59 p.m. PT on June 23, 2024 - 12:00 a.m. PT on June 24, 2024 – 11:59 p.m. PT on June 30, 2024 - 12:00 a.m. PT on July 1, 2024 – 11:59 p.m. PT on July 7, 2024 - 12:00 a.m. PT on July 8, 2024 – 11:59 p.m. PT on July 14, 2024   Entries will be eligible for the Entry Period in which they are received and will not carryover to subsequent weekly entry periods.  You must enter into each weekly Entry Period separately.   How to Enter: We invite you to participate in a quest to provide "Accepted Solutions" to as many questions as you can. Answers can be provided in all the communities. Users must provide a solution which can be an “Accepted Solution” in the Forums in all of the communities and there are no limits to the number of “Accepted Solutions” that a member can provide for entries in this challenge, but each entry must be substantially unique and different.    Winner Selection and Prizes: At the end of each week, we will list the top ten (10) Community users which will consist of: 5 Community Members & 5 Super Users and they will advance to the final drawing. We will post each week in the News & Announcements the top 10 Solution providers.  At the end of the challenge, we will add all of the top 10 weekly names and enter them into a random drawing.  Then we will randomly select ten (10) winners (5 Community Members & 5 Super Users) from among all eligible entrants received across all weekly Entry Periods to receive the prize listed below. If a winner declines, we will draw again at random for the next winner.  A user will only be able to win once overall. If they are drawn multiple times, another user will be drawn at random.  Individuals will be contacted before the announcement with the opportunity to claim or deny the prize.  Once all of the winners have been notified, we will post in the News & Announcements of each community with the list of winners.   Each winner will receive one (1) Pass to the Power Platform Conference in Las Vegas, Sep. 18-20, 2024 ($1800 value). NOTE: Prize is for conference attendance only and any other costs such as airfare, lodging, transportation, and food are the sole responsibility of the winner. Tickets are not transferable to any other party or to next year’s event.   ** PLEASE SEE THE ATTACHED RULES for this CHALLENGE**   Week 1 Results: Congratulations to the Week 1 qualifiers, you are being entered in the random drawing that will take place at the end of the challenge. Community MembersNumber of SolutionsSuper UsersNumber of Solutions @anandm08  23 @WarrenBelz  31 @DBO_DV  10 @Amik  19 AmínAA 6 @mmbr1606  12 @rzuber  4 @happyume  7 @Giraldoj  3@ANB 6 (tie)   @SpongYe  6 (tie)     Week 2 Results: Congratulations to the Week 2 qualifiers, you are being entered in the random drawing that will take place at the end of the challenge. Community MembersSolutionsSuper UsersSolutions @anandm08  10@WarrenBelz 25 @DBO_DV  6@mmbr1606 14 @AmínAA 4 @Amik  12 @royg  3 @ANB  10 @AllanDeCastro  2 @SunilPashikanti  5 @Michaelfp  2 @FLMike  5 @eduardo_izzo  2   Meekou 2   @rzuber  2   @Velegandla  2     @PowerPlatform-P  2   @Micaiah  2     Week 3 Results: Congratulations to the Week 3 qualifiers, you are being entered in the random drawing that will take place at the end of the challenge.   Week 3:Community MembersSolutionsSuper UsersSolutionsPower Apps anandm0861WarrenBelz86DBO_DV25Amik66Michaelfp13mmbr160647Giraldoj13FLMike31AmínAA13SpongYe27     Week 4 Results: Congratulations to the Week 4 qualifiers, you are being entered in the random drawing that will take place at the end of the challenge.   Week 4:Community MembersSolutionsSuper UsersSolutionsPower Apps DBO-DV21WarranBelz26Giraldoj7mmbr160618Muzammmil_0695067Amik14samfawzi_acml6FLMike12tzuber6ANB8   SunilPashikanti8

Check Out | 2024 Release Wave 2 Plans for Microsoft Dynamics 365 and Microsoft Power Platform

On July 16, 2024, we published the 2024 release wave 2 plans for Microsoft Dynamics 365 and Microsoft Power Platform. These plans are a compilation of the new capabilities planned to be released between October 2024 to March 2025. This release introduces a wealth of new features designed to enhance customer understanding and improve overall user experience, showcasing our dedication to driving digital transformation for our customers and partners.    The upcoming wave is centered around utilizing advanced AI and Microsoft Copilot technologies to enhance user productivity and streamline operations across diverse business applications. These enhancements include intelligent automation, AI-powered insights, and immersive user experiences that are designed to break down barriers between data, insights, and individuals. Watch a summary of the release highlights.    Discover the latest features that empower organizations to operate more efficiently and adaptively. From AI-driven sales insights and customer service enhancements to predictive analytics in supply chain management and autonomous financial processes, the new capabilities enable businesses to proactively address challenges and capitalize on opportunities.    

Updates to Transitions in the Power Platform Communities

We're embarking on a journey to enhance your experience by transitioning to a new community platform. Our team has been diligently working to create a fresh community site, leveraging the very Dynamics 365 and Power Platform tools our community advocates for.  We started this journey with transitioning Copilot Studio forums and blogs in June. The move marks the beginning of a new chapter, and we're eager for you to be a part of it. The rest of the Power Platform product sites will be moving over this summer.   Stay tuned for more updates as we get closer to the launch. We can't wait to welcome you to our new community space, designed with you in mind. Let's connect, learn, and grow together.   Here's to new beginnings and endless possibilities!   If you have any questions, observations or concerns throughout this process please go to https://aka.ms/PPCommSupport.   To stay up to date on the latest details of this migration and other important Community updates subscribe to our News and Announcements forums: Copilot Studio, Power Apps, Power Automate, Power Pages

Top Solution Authors
Top Kudoed Authors
Users online (3,797)