Html Img Source only works with http location and not local folder

Hi Timilselvan,

thanks for the advice. Worked great for me too. I had the same issue! I just want to mention, that this should be included in the official UiPath Forms documentation (https://docs.uipath.com/activities/docs/form-activity)

Here it’s written that the html code should look like that for inserting local images: <img src={{data.sampleimage1}} height=100 width=100 >

Kind regards
Patrick

1 Like

Hi @Tamilselvan

I need the image to be dynamic, so following the above suggestion, and what the documentation says, i tried

< img src=“data:image/png;base64," {{data.SampleImage1}} />

where SampleImage1 is a variable for the base64string of the image, that is passed into the HTML element in the form, but i’m not getting anything displayed correctly.

Note: SampleImage1 is an IN argument into the Create Form activity

Any idea if that’s just a limitation at the moment…?

2 Likes

Hi @warren_lee

use it like < img src=“{{data.SampleImage1}}” /> and enable Refresh on change to true

1 Like

Hi @Tamilselvan,

Tried it, but it’s still not displaying the image.
I have attached a copy of the test workflow i’m using - if you can let me know if you can spot any issues that i may have missed that would be much appreciated!

ThanksLoadImage_Test.zip (34.9 KB)

Hi @warren_lee

I have modified it. Please find the working example.

You have to add “data:image/jpeg;base64,” + Base 64.

LoadImage_Test.zip (39.3 KB)

2 Likes

Hi @Tamilselvan,

Thanks! That worked.
I was also trying to see if other than image, if we can also display local PDF files via html tag.

I tried both iframe and embed, but it always comes up as empty when i run the form

However, if i use iframe with an online PDF publicly available on the internet, it works fine.

Do you know if we can render local PDF files in UiPath Forms? or is there a limitation to it at the moment?

Thanks

As of now, we have limitation with local PDF.
We haven’t testes this scenario.
We will have a internal discussion with our PM on this feature.

@Tamilselvan
Could you please explain how to add background image to a form?
Both using HTML and without using HTML

Hi @Tamilselvan, i tried to get this to work, but it is different in the newest version?
I am trying to use the create form task, i have the image hosted on the local group.

I tried to put the iis url as src, it works when i put it static, but i cant get it working with dynamic values. Either as B64 or url.

Seems like all arguments are bugged in the forms.
It seems like the info is passed on, but i can’t reference to them and use them in a form.

Hi loginerror

Is it not possible to use images in the form tasks, ie. displayed in Orchestrator?

I tried to copy your cat form and do form task, but image is not showing up. I remade it exactly as the form. It showed up in the local form,but not in task.

Have you checked the Refresh on change checkbox in HTML component?
Also, could you share a screenshot of how you are configuring the HTML component which adds this image?

Hi Paras,

yes sure.

image

(i tried one element with static source, also doesnt work.

and here my dynamic element

ImageForm.xaml (20.1 KB) attached is also the workflow

None of the images are showing up in the orchestrator, i also tried with links to pictures on google, also no luck.

Hi Markus,
I tried your workflow, you can try configuring the HTML component like below (attributes on p tag should be removed and added to the img tag in 'content' section). I have tested this on cloud.uipath.com to be working just now. Just FYI, we have one issue where the images are not loaded when the form in unassigned. It is fixed now and should be available in the next cloud deployment.

1 Like

Thanks! that finally worked. Previous examples i saw that the reference as {{data.imageSample}}, but somehow the spaces made the difference

1 Like

Hello @Tamilselvan,

I tried your solutions and i am getting the positive results.

Thank you. :smiley:

Hello, I am passing multiple images to form through base64 format and no issues with form display, but receiving the below exception after submit. Any help would be much appriciated.

Create Form: Binary stream ‘0’ does not contain a valid BinaryHeader. Possible causes are invalid stream or object version change between serialization and deserialization.

Hi @UniversalBoss

Any chance you could provide a sample input? :slight_smile:

Hi @Tamilselvan,
Thanks for the example.
I am trying to add the submit button to the working example which you have shared. I am getting error as
Create Form: Binary stream ‘0’ does not contain a valid BinaryHeader. Possible causes are invalid stream or object version change between serialization and deserialization.

Can you please help on how I can avoid this. Thank you.