Is it possible to disable options once picked?

  • Profile Image
    caffandcandy
    Asked on August 06, 2019 at 01:18 PM

    Hi,

    I love your forms and will be needing to upgrade to a paid plan. I want a form that once one person picks a number, it is disabled for everyone else that uses the form next. I have my sample form made in my account.


    I am needing a function to "reserve" numbers that once it's filled out once, the next person cannot choose that number (greyed out).


    Is this possible?


    Thanks,

    Jesse

  • Profile Image
    denis_calin
    Answered on August 06, 2019 at 02:23 PM

    Hi Jesse!

    Yes, this is possible with the Ticket Purchases widget. Simply enter the numbers each on new line in the Ticket Types field in Widget Settings (the gray Wand icon). Set Max Selection to 1 and click on the green Update Widget button at the bottom. You can also use the Appointment Slots widget for the same purpose. I have created a sample form for you with the Ticket Types widget, please clone it to take a closer look at the setup.

    Form: https://form.jotform.com/92175535236964

    Guide: How-to-Clone-an-Existing-Form-from-a-URL

    Guide: How-to-Add-a-Widget-to-Your-Form

  • Profile Image
    Jesse
    Answered on August 06, 2019 at 09:51 PM

    Thank you! That's fantastic. I didn't see that there were that many widget options before. I am definitely going to upgrade my account. 


    Do you think there is a better way to do this. I might have up to 150 options for some of these questions? That way people aren't scrolling down the page for 5 minutes, haha.


    Thank you, 

    Jesse

  • Profile Image
    Kiran
    Answered on August 07, 2019 at 01:50 AM

    You may try adding the following CSS code to the widget so that the selection boxes shall be displayed in multiple columns. 

    ul {

      column-count: 3;

      -webkit-columns: 3;

      -moz-columns: 3;

    }

    .items-left {

    display: none;

    }

    156515698907082019_110841.png

    Hope this information helps! 

  • Profile Image
    caffandcandy
    Answered on August 07, 2019 at 01:20 PM

    Thanks guys! That code works great on the preview and desktop but on mobile it expands outside the selection. Is there another line of code I can add to help with this? 


    Thanks again!

  • Profile Image
    Kiran
    Answered on August 07, 2019 at 02:15 PM

    I have checked your Jotform on an Android mobile device and see that the field is displaying correctly. 

    156520168507082019_230832.png

    Were you able to fix the issue? If you need any further assistance, please let us know. We will be happy to assist.  

  • Profile Image
    Jesse 
    Answered on August 07, 2019 at 02:25 PM

    This is what I’m seeing on iPhone 

    156520228964C90521-A4DC-49B4-94F7-AED603

  • Profile Image
    Kiran
    Answered on August 07, 2019 at 02:41 PM

    The issue seems to be happening only with iPhones.  Please try adding the following CSS code to the form so that it should be displaying properly on iPhones. 

    @supports (-webkit-overflow-scrolling: touch) {

    .checklist label.checkbox {

    padding-right: 1em !important;

    }

    }

    Thanks!

  • Profile Image
    caffandcandy
    Answered on August 07, 2019 at 02:49 PM

    Amazing! Thank you that worked perfectly.