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

    How can I disable some buttons on an Image Checkbox?

    Asked by StrawberryDesi on September 05, 2016 at 11:24 PM

    In my Cincinnati Meeting Report form, on page 4, on the Amount Paid Image Checkbox; I'd like to disable all of the options except the "Special Circumstances" button.  How can I do that?  If there isn't a way to do it simply, is there a custom CSS code that will work?  Please let me know.

     

    Thank you.

     

     

    Henry

    checkbox image checkbox how how can i
  • Profile Image
    JotForm Support

    Answered by Chriistian on September 06, 2016 at 01:43 AM

    There is no setting to disable some buttons in the Image Checkbox, however, we can indeed use some custom CSS to disable these buttons. Simply add the css below to the Custom CSS area of the Image Checkbox Widget.

    li{

        pointer-events: none;

    }

    #images_button_container li:nth-of-type(9)  {

        pointer-events: all;

    }

    To open the Custom CSS area, first click the wand icon of the Image Checkbox widget.

    Then select the Custom CSS tab and paste the code to the css area.

    Once the css is added all the checkboxes will be disabled except the Special Circumstances checkbox. You can also check out this demo to see it in action and clone it to your accounthttps://form.jotform.com/62491358684972 

    If you need further assistance, please let us know.
    Regards.

  • Profile Image

    Answered by StrawberryDesi on September 07, 2016 at 12:16 AM

    Thanks Chriistian.  That worked PERFECTLY!

     

    Now, I need to do the same thing with my Briefly explain the "Special Circumstances" question.  I'd like to disable all of the choices except the "ALREADY PAID" button.  Can you supply me with the Custom CSS code to make that happen?

     

    Thank you.

     

     

    Henry

  • Profile Image
    JotForm Support

    Answered by Chriistian on September 07, 2016 at 01:39 AM

    You can inject the custom css code below to the Form CSS (not the widget css) of your form to disable all the buttons except the "ALREADY PAID" button. Here's a guide on How to Inject Custom CSS Codes. I noticed that you have two versions of the same field, so the css code below will affect each of their fields. If you only want to disable the buttons on a certain page (ex: Page 4), simply copy the corresponding code seen below.

    /*Disable the buttons on page 3*/

    #cid_37 .form-radio-item {

        pointer-events: none;

     

    }

    #cid_37 .form-radio-item:first-child {

        pointer-events: all;

     

    }

    /*Disable the buttons on page 4*/

    #cid_62 .form-radio-item {

        pointer-events: none;

     

    }

    #cid_62 .form-radio-item:first-child {

        pointer-events: all;

     

    }

    If you need further assistance, please let us know.
    Regards.