Can I upload images using a repeater?

Hi,
I know how to use a repeater to add text values that a user enters into a row and add them to a row.
But can not you select a specific image here and add it as a variable to that image and add it?
Or is it impossible to load a set of images in sequence, rather than your local drive?

I will attach the file that I implemented so that I can register only the text value.

Thank you :slight_smile:
add row.rp (57.6 KB)

@JIN_n,

There are a few things you can do to dynamically load/show images in a repeater, depending on where your images are located (online/offline), how many unique images you need to support, how many rows in your repeater, how big the images are and/or speed you might want.

If your images are or can be posted online (and devices using the prototype have online access to those web locations) then you can dynamically add rows and assign a repeater column value with a URL for the image you want to show. If all the images are in the same server directory, you can just assign the filename and prepend the base URL in your OnItemLoad event. So, let’s say you have an image widget in your repeater named, “icon”. You can use the action, Set Image to dynamically change the image–and you can choose to import an image from the local drive or use a value to specify the image location. To do this in a repeater, you’ll need a column in your datasheet to handle the image filenames and/or source locations–let’s say this is named “MyImage”, and all the possible icon images are located at “my.server.com/images/*.png”. You would create an OnItemLoad case like,
If [[Item.MyImage]] does not equal "" Set icon image to "my.server.com/images/[[MyImage]].png"
–and you would choose “value” instead of the default “image” in the Set Image action. To change an existing repeater row, use the Update Row action and to add a new row, use the Add Row action; in both cases, enter the image filename in the MyImage column. --This will tend to run slow, depending on internet connection, server, etc.

If the “online solution” doesn’t work or is too slow, you can copy a folder of images to the HTML folder (use a subfolder name other than “images” as that is used by Axure already) and use MyImages/myimagefile.png as the URL.

Or, if you have a limited set of unique images you can create a dynamic panel in your repeater with one state for each image. In your repeater column, use the name of the state to refer to a specific image and in the OnItemLoad event, change the state of the dynamic panel to the value [[MyImage]]. I’ve used these with 20 to 30 rows and 20 image states with good results.

2 Likes

@JIN_n

I see @mbc66 beat me to it (again).

It also seems I misunderstood your requirements. I was thinking you wanted to be able to use the input type “file” to browse to a location, select a file, and have it added to a repeater.

It is possible to do with javascript injection, but it’s a little complicated and it requires you know the location of where the images are stored ahead of time.

But, in case it is what you were really after (and because it took me forever to figure it out so I might as well share it), here ya go: DynamicUpload.rp (65.4 KB)

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.