Change image displayed based of off row user selects from table

Ignition
1

Hello, I want to display different pictures based on the data in a table that the user clicks. For example, if I have the following table

Row Image
1 Click to show a flower
2 Click to show a car
…

2

You’ll want to use the onMousePress or onDoubleClick event handlers in the component scripting of a power table. From there you can set the image path on the image component. It is easy to write the picture path to a string memory tag with the tag bound to the image component.

data = self.data
clickData = data.getValueAt(rowIndex, 'yourColumnName')

if clickData == 'cat':
          path = 'catPic.jpg'
else:
          path = 'carPic.jpg'
system.tag.write.('picPathTag',path)
1 Like
3

Will try that. Thanks!

4

You could also make the image names (or paths to the image) as a hidden column. a simple lookup expression could take it from there.

5

I tried the system.tag.write, but did not get it working. I am able to create a session variable and it points to the file, but when I bind it to the image property, it comes back blank. Is there a way for an image file to use a session variable?

6

You have to supply the path to the photo file, not just the name of the file.
The easiest way is to place the image in a location which can be served by your Gateway - Inductive Automation\Ignition\webserver\webapps\main, for example - and then supply the path within that directory.

Assuming a file located at C:\Program Files\Inductive Automation\Ignition\webserver\webapps\main\carpic.jpg, you should be able to supply carpic.jpg for the image source.

7

Thank you. I also noticed that the filename is case sensitive. I had JPG in the string,but the picture was jpg. Once I corrected the case, the problem was fixed.