How do I integrate a JavaScript image gallery library into a form?

Confluence User - 31 May, 2018

Hello,

I've made an app where a user can upload multiple images using an image upload field;

and I'd like to include an image gallery for the uploaded images, where the user can see thumbnails of images and click them to view the full image (using a JavaScript lightbox library such as prettyPhoto, or any other one)

I'm going to put the HTML and related script and CSS in a custom HTML field.

How do I reach the images the user will upload to view them, in the custom HTML field?

What do I put in the "src" attribute of the "img" element, to view the uploaded image?

forms;userviews;images;user

5


01 Jun, 2018
confluenceUser
confluenceUser

Hi Sarah,

When you upload an image to Joget, Joget will store the image at this location, note that there is a dot at the end of the path. If you forget the dot, the image will not appear


/jw/web/client/app/<app_id>/1/form/download/<form_id>/<record_id>/<imagename>.

sample

/jw/web/client/app/ad_System/1/form/download/ad_Products/5cfb5104-c0a86310-19b35090-b0e4219f/LEX485RSIBPSS-1-CE(2).png.


The best way to understand this is to upload one image with the default image field and right click on the image to get the URL string like how its described here Show images in List.

Hope this helps.

 

Regards

20 Jun, 2018
confluenceUser
confluenceUser

Hi, Voon. Thanks a lot for answering! May I ask how I can get the record id from inside a form?

20 Jun, 2018
confluenceUser
confluenceUser

Hello Sarah, You can look into Hash Variables to get record ids. The link is here --> https://dev.joget.org/community/display/KBv6/Hash+Variable#HashVariable-FormDataHashVariable Cheers.

24 Jun, 2018
confluenceUser
confluenceUser

Hi, Justin I found that the available hash variables for forms is only for field values, not record Ids

25 Jun, 2018
confluenceUser
confluenceUser

Hi Sarah, You may use an SQL client to inspect your database tables for easy reference. You may use the column named "id" to obtain the record id, e.g.: #form.your_table_name.id#

RELATED QUESTIONS

Your answer


To answer a question you'll need an account.

Print