Hello,
I’m not sure about your question. But if you want to insert images on your form and display them based on the choices selected from a dropdown field, you have multiple alternatives:
- You can insert multiple “Media” controls, one per image, and configure them as dependent fields on the DropDown choices.
Learn more about dependencies by reading the following blog post:
https://cff.dwbooster.com/blog/2020/03/01/dependencies
- Alternatively, you can display the images by code. I’ll try to describe the process with a hypothetical example.
Assuming the dropdown field is the fieldname1, with choices A, B, and C. If the user selects choice A, you want to display the image https://www.yourwebsite.com/images-path/image1.png, display the image https://www.yourwebsite.com/images-path/image2.png when the user selects choice B, and https://www.yourwebsite.com/images-path/image3.png for the choice C.
First, insert an “HTML Content” field in the form, and enter a DIV field in its content where displaying the images. Ex <div class="images-container"></div>
Second, insert a calculated field, that you can configure as hidden by ticking a checkbox in its settings, and enter the following equation:
(function(){
var image = '';
if(fieldname1 == 'A') image = '<img src="https://www.yourwebsite.com/images-path/image1.png">';
if(fieldname1 == 'B') image = '<img src="https://www.yourwebsite.com/images-path/image2.png">';
if(fieldname1 == 'C') image = '<img src="https://www.yourwebsite.com/images-path/image3.png">';
jQuery('.images-container').html(image);
})()
Best regards.
