Hide the final preview of selected images in Image choice widget

  • jaiswal78
    Asked on September 18, 2015 at 5:38 PM

    I want to use the image choices widget, but do not want to show the final preview of the selected choices. Is this possible by using custom css or something similar. If so can you please give the code.

  • jonathan
    Replied on September 19, 2015 at 2:32 AM

    Hi,

    I assume this is the form http://www.jotformeu.com/form/52605891907362 in question..

    Can you please describe more what exactly it is you want to do?

    I could not determine this part..

     do not want to show the final preview of the selected choices.  

    I test your form, and when using the image select widget I see it like this

    Hide the final preview of selected images in Image choice widget Image 1 Screenshot 20

     

     

    when I submit the form, it immediately go to the Thank You page. It doesn't have a Preview option.

    Please provide us more details on the requirement, and we will help find a workaround if needed.

     

    Thanks.

  • jaiswal78
    Replied on September 19, 2015 at 5:47 AM
    Hi,
    Indeed that is the form. As I am in the process of making the form, hence it is not yet complete. What I want to achieve is that in the image choices widget (I have used the default links in the form and taken screen shots of that).
    This is the second question - and I guess that we can keep adding the number of questions.
    But when all the questions of this widget is answered, then it displays a preview of the responses selected as shown in the screenshot below. I want that this preview should not be shown, but the form control moves on to the next field.
    ...
  • Ben
    Replied on September 20, 2015 at 2:33 AM

    Thank you for the additional details. Please do note however that if you send the images over email, they will not be shown / attached to the forum posts.

    The only way to attach the same is to follow steps explained here: How to add screenshots/images to questions in support forum? by my colleague.

    Looking at the form again, I am also not sure about what you mean.

    From what I see, you are selecting the option on the page 1 which then shows you the proper field on the page 2 based on this selection.

    Now I would only like to mention that instead of this setup:

    Hide the final preview of selected images in Image choice widget Image 1 Screenshot 30

    You can minimize them by setting them up like this:

    Hide the final preview of selected images in Image choice widget Image 2 Screenshot 41

    While it is shorter, it will also be slightly faster than above, since JotForm will always hide the fields that have SHOW rule on them - until the rule matches the pre-set condition :)

    Hope this helps with future conditions endeavors, but please do re-attach the images by following the steps above (this is the thread: https://www.jotform.com/answers/665552) so that we can properly understand and assist the issue.

  • jaiswal78
    Replied on September 20, 2015 at 4:45 AM

    Hi,

    Thanks for the support. I want to use my form as an iframe on my website. Only the form window should appear and not the complete form screen having the background image. Please see attached screen shot for better explanation.

    Hide the final preview of selected images in Image choice widget Image 1 Screenshot 20

    Also in the form I want that the after selecting the choice, the control automatically moves to next page without clicking next.

  • Chriistian Jotform Support
    Replied on September 20, 2015 at 11:33 PM

    Hi,

     

    Are your referring to this form - http://www.jotformeu.com/form/52625943372358? Can you try to inject this custom CSS code in your form to remove the background image and adjust the spacing around your form?

    .supernova {

        background-image: none !important;

    }

    .jotform-form {

        padding: 0px !important;

    }

    .form-all {

        margin: 0 !important;

        padding: 0 !important;

    }

     

    To inject custom CSS code in your form, you can follow the instruction provided in this article: How to Inject Custom CSS Codes.

     

    Do let us know if you need further assistance.
    Regards.