How can I upload an image to a "Drop Down Element" in my form?

  • tedxmanhattanbeach
    Asked on September 5, 2024 at 2:50 PM

    Hello!
    I really like the look of the "Product List" widget where I can include an image (of a product) along with a drop down where the user can select a quantity. I am using this element to capture rental equipment requests that are free of charge - so I don't need the pricing component. Additionally, I would prefer for each product/quantity to be able to have "0" as a default option AND I would prefer for the report to be separated by product rather than have them grouped into a single field.

    So rather than using the "Product List" widget, is there a way to create a "Drop Down" element that includes images? See below for the image look and feel I am hoping to replicate with individual elements.


    Thanks!

    Jotform Thread 18708481 Screenshot
  • Aleeza_A
    Replied on September 5, 2024 at 3:57 PM

    Hello tedxmanhattanbeach,

    Thanks for reaching out to us for help. You can use separate elements such as Image and Drop-down menu as a workaround for that. Let me show you how:

    • IForm Builder, go to the Add Element.

    How can I upload an image to a Drop Down Element in my form? Image 1 Screenshot 60

    • Add product images using the Image element.

    How can I upload an image to a Drop Down Element in my form? Image 2 Screenshot 71

    • Add Dropdown element below each image for quantity selection.

    How can I upload an image to a Drop Down Element in my form? Image 3 Screenshot 82

    • Set up the dropdown with options (including "0" as the default) in the properties.

    How can I upload an image to a Drop Down Element in my form? Image 4 Screenshot 93

    • Label each dropdown to match the product image above it.
    • Arrange the images and dropdowns to clearly associate each dropdown with its product.
    • Preview your form to ensure everything functions as expected and save and publish your form.

    As for your other concern, please note that this method will ensure each product's quantity is reported separately in submissions. Check out the screencast below to see my results:

    How can I upload an image to a Drop Down Element in my form? Image 5 Screenshot 104 Give it a try and let us know how it goes.

Your Answer