What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Image Radio Buttons demo is not working

    Asked by pthimsen on February 23, 2015 at 04:16 PM

    I'd asked about an image option that showed selections as the images themselves. I see there is a widget for this that looks similar to the image check box. I do need the Radio Button options as they can only select one. The widget as it appears in the demo is apparently broken or no longer available.

    Is there a time this will be fixed and available in the future?

    http://form.jotform.us/form/50395015285151

    Here is my form and I have several pages that feature images as the choice. The way these appear are my preference.

    Thank you,
    Pat

     

     

     

    radio buttons Image Radio Buttons image radio image option select
  • Profile Image

    Answered by Ben on February 23, 2015 at 05:34 PM

    Thank you for letting us know about this Pat. I have update the demo so it will work now.

    Please re-check the Image Radio Buttons widget page.

    Can you please tell us if you are looking to add this widget to your jotform and have some issues doing so? If that is the case, please let us know what is the page where you are adding it so that we can find it easier and assist you in setting it up?

  • Profile Image

    Answered by pthimsen on March 06, 2015 at 03:24 PM

    Hi there - just following up on this. So the demo is working but not the actual Image Radio Button Widget. The demo shows the images as the button but what shows up on the form is circle button under the image which. The circle button looks out of place and not as clean as having the image be the button which is a much better look to me.

    Please let me know once this Image Radio button is fixed to be as it appears in the demo. I have multiple pages on my form where we are using this option. I will update the form once it is corrected.

    Thank you - Pat

     

     

     

  • Profile Image

    Answered by Ben on March 06, 2015 at 04:42 PM

    OK, I see what you mean Pat, but please note that this is the latest version of the Radio Image Buttons widget and that is why it is not the same as the old screenshots.

    We can make it look the same however by adding the following code:

    div.orange-radio {
        background: none repeat scroll 0 0 transparent;
        border: 2px solid gray;
        border-radius: 4px;
        height: 80px; /* this must be set to the same number as the image size height is set to */
        left: -2px !important;
        top: 0 !important;
        width: 80px; /* this must be set to the same number as the image size width is set to */
    }
    li.checked div.orange-radio {
        background: none repeat scroll 0 0 rgba(180, 90, 190, 0.2);
    }

    You can see a demo of it here: http://form.jotformpro.com/form/50646843596972

  • Profile Image

    Answered by pthimsen on March 06, 2015 at 05:30 PM

    Weird that the old version seems more up-to-date than the new version - I will give this a try although I am not at all knowledgeable when it comes to coding (which is why I was so pleased to find JotForm). Thank you -

  • Profile Image
    JotForm Support

    Answered by Kiran on March 06, 2015 at 07:32 PM

    Sure. You just need to add the code provided by my colleague in the Custom CSS code section of the widget. 

    Please get back to us if you need any further assistance. We will be happy to help.

    Thank you!