Title: Hide Image
Last modified: April 1, 2023

---

# Hide Image

 *  Resolved [albertoayesa](https://wordpress.org/support/users/albertoayesa/)
 * (@albertoayesa)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/hide-image-3/)
 * Hello
 * How can I load images to diferent field hidden them in the website?
 * I want to use them in a dropdown
    -  This topic was modified 3 years, 2 months ago by [albertoayesa](https://wordpress.org/support/users/albertoayesa/).

Viewing 2 replies - 1 through 2 (of 2 total)

 *  Plugin Author [codepeople](https://wordpress.org/support/users/codepeople/)
 * (@codepeople)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/hide-image-3/#post-16616456)
 * 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](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](https://www.yourwebsite.com/images-path/image1.png),
   display the image [https://www.yourwebsite.com/images-path/image2.png](https://www.yourwebsite.com/images-path/image2.png)
   when the user selects choice B, and [https://www.yourwebsite.com/images-path/image3.png](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:
 *     ```wp-block-code
       (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.
 *  Thread Starter [albertoayesa](https://wordpress.org/support/users/albertoayesa/)
 * (@albertoayesa)
 * [3 years, 2 months ago](https://wordpress.org/support/topic/hide-image-3/#post-16617892)
 * Thank you

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Hide Image’ is closed to new replies.

 * ![](https://ps.w.org/calculated-fields-form/assets/icon-256x256.jpg?rev=1734377)
 * [Calculated Fields Form](https://wordpress.org/plugins/calculated-fields-form/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/calculated-fields-form/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/calculated-fields-form/)
 * [Active Topics](https://wordpress.org/support/plugin/calculated-fields-form/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/calculated-fields-form/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/calculated-fields-form/reviews/)

 * 2 replies
 * 2 participants
 * Last reply from: [albertoayesa](https://wordpress.org/support/users/albertoayesa/)
 * Last activity: [3 years, 2 months ago](https://wordpress.org/support/topic/hide-image-3/#post-16617892)
 * Status: resolved