# How do I load images on a popup windows dynamically?

**URL:** <https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789>\
**Category:** Ignition\
**Created:** [November 8, 2019, 3:08pm UTC](https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789 "2019-11-08T15:08:01Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![bmeyers](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmeyers/32/37453_2.png) [@bmeyers](https://forum.inductiveautomation.com/u/bmeyers)\
**Post date:** [November 8, 2019, 3:08pm UTC](https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789/1 "2019-11-08T15:08:01Z")

</div>

Our user wants to know some information about his/her tanks at their factory. The tanks might change contents in the future though so they need to load information from the tanks dynamically.

I want to have them press a button on Tank 1 and dynamically load information on the chemical in Tank 1. If in the future they change over to a new chemical the button should load information on the new chemical. I have images of chemical info but how do I load that information dynamically?

---

<div class="post-metadata">

**Author:** ![RadicalRumin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/radicalrumin/32/11543_2.png) [@RadicalRumin](https://forum.inductiveautomation.com/u/RadicalRumin)\
**Post date:** [November 8, 2019, 3:17pm UTC](https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789/2 "2019-11-08T15:17:02Z")

</div>

A low fidelity answer would be to simply overlay the images and change visibilities depending on the chemical in the tank, which you could store in a tag or something.

First thing I could think of, probably not ideal depending on the amount of possible chemicals.

---

<div class="post-metadata">

**Author:** ![bkarabinchak.psi](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bkarabinchak.psi/32/83567_2.png) [@bkarabinchak.psi](https://forum.inductiveautomation.com/u/bkarabinchak.psi)\
**Post date:** [November 8, 2019, 3:42pm UTC](https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789/3 "2019-11-08T15:42:59Z")

</div>

These chemicals that are in the tanks - they have their own database table? Upload the images of the chemcals to the gateway. Then you have a few options.

One thing I’ve seen is to store the paths of images in the database tables. So you would query for `SELECT imgPath FROM chemicals WHERE idx = %i` in a image path property binding. This does require you to update the databsae if you end up moving images around on your gateway image management though.

Similarly, if you only have a handful images it could ever possible, you can again bind a image property binding to something like `if(CONDITION, 'imagepath1.jpg', if(CONDITION2, 'imagepath2.jpg', 'imagepath3.jpg'))`.

Again with both these methods keeping the path consistent is important, so if you move a image from one folder to another on the gateway youre expression or database field will have to change.

I know you can store images on a database as a `Blob` type, but I am not sure how you would load that up to an ignition component. Maybe someone else could speak on that, but it would eliminate any path issues.

---

<div class="post-metadata">

**Author:** ![bmeyers](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmeyers/32/37453_2.png) [@bmeyers](https://forum.inductiveautomation.com/u/bmeyers)\
**Post date:** [November 8, 2019, 4:00pm UTC](https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789/4 "2019-11-08T16:00:27Z")

</div>

I will look into this.

My first attempt was to load images chemInfo1, chemInfo2, chemInfo3 into their own folders ‘chemInfo/1/chemInfo1.jpg’ and so on. Then I passed the value ‘1’ from a variable to the popup and finally linked the image path on the popup to an indirect tag 'chemInfo/{1}/chemInfo1.jpg.

But the image path, even though tied to this variable correctly, is refusing to load upon screen creation. A bug possibly? Or I don’t really understand how images are loaded.

---

<div class="post-metadata">

**Author:** ![grietveld](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/grietveld/32/6984_2.png) [@grietveld](https://forum.inductiveautomation.com/u/grietveld)\
**Post date:** [November 8, 2019, 4:02pm UTC](https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789/5 "2019-11-08T16:02:23Z")

</div>

At least in the way I’m picturing your configuration, I don’t think indirect tag would work. You could do it within an expression though to pull in that tag value and build the path though.

---

<div class="post-metadata">

**Author:** ![bkarabinchak.psi](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bkarabinchak.psi/32/83567_2.png) [@bkarabinchak.psi](https://forum.inductiveautomation.com/u/bkarabinchak.psi)\
**Post date:** [November 8, 2019, 4:04pm UTC](https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789/6 "2019-11-08T16:04:18Z")

</div>

Double check the path. It is 100% correct? What type of component are you trying t display it on?

---

<div class="post-metadata">

**Author:** ![bmeyers](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmeyers/32/37453_2.png) [@bmeyers](https://forum.inductiveautomation.com/u/bmeyers)\
**Post date:** [November 8, 2019, 4:09pm UTC](https://forum.inductiveautomation.com/t/how-do-i-load-images-on-a-popup-windows-dynamically/29789/7 "2019-11-08T16:09:34Z")

</div>

@grietveld - This worked, thank you! Final syntax looks like this: “ChemInfo/” + {Root Container.Tank1} +"/chemInfo1.JPG". The path is case sensitive in case anyone is wondering including the “.JPG” at the end. I had put “.jpg” and it did not load.
