Creating Conditions Based off of Checkboxes

  • Profile Image
    melreid20
    Asked on February 25, 2021 at 12:07 AM

    Hello,

    I'd like to create conditions for the following. If you could provide me step by step instructions that would be helpful.

    Employment Termination / Questionnaire

    1. Have you done...IF "Checked timesheet..." is not checked I'd like to have the below message (You cannot finish..) show up and the user not be able to complete the form
    2. The checkbox border to be red
    3. Have you done...IF "Final Mileage..." is not checked I'd like to have the below message (You cannot finish...) show up and the user not be able to complete the form
    4. The checkbox border to be red
    5. If both are not checked same as above
    6. The "You cannot finish..." message ONLY display when either or both of the above are not checked
    7. If the message above shows up, I'd like them to not be able to complete the form and have a close form option.

    I hope this makes sense.

  • Profile Image
    Mike_G
    Answered on February 25, 2021 at 05:29 AM

    We will be glad to help you with your concern. Please allow me some time to work on a solution to meet your requirements. I'll get back to you on this ticket as soon as possible.

  • Profile Image
    Mike_G
    Answered on February 25, 2021 at 05:55 AM

    I have created a form that will show the "You cannot finish.." finish message if neither of the following options is selected when the "Have you done" field is filled.

    • Checked Timesheet for Errors
    • Final Mileage Report Completed and Sent to Lloyd

    Here's the link to a cloned version of your form: https://form.jotform.com/210551966328964

    I have added an additional field that is used to check the selected option, which can be hidden later.

    1614250272_603781209f451_zt210225_054856

    The conditions I have added to that form will also hide the submit button.

    1614250246_60378106cfd59_zt210225_054927

    I have also updated this condition so the Page Break will also be hidden.

    1614250339_60378163ae133_zt210225_055209

    1614250351_6037816fd418e_zt210225_055155

    However, as for changing the color of the checkbox based on conditions, I have checked and I have not found any available workaround or solution for that. How would you like to consider changing the color of the option's label to the correct color if the option is checked. This means that, by default, the option's label is red, then when the option is selected it will change to black?

    We will wait for your response.

  • Profile Image
    melreid20
    Answered on February 25, 2021 at 11:46 AM

    Thank you. I've been able to re-create those conditions.

    As for the color coding, I have been trying to do the CSS coding for those check boxes, however; every time I go into Designer Mode it removes my Form Background and turns it to a solid. I can do the method you suggested, if you could tell me how to do that I can. If I have to go into the CSS I am concerned because of the above mentioned.

  • Profile Image
    Mike
    Answered on February 25, 2021 at 06:39 PM

    You may add the next CSS using regular Form Designer to change the label color from red to black when the option is checked:

    #label_input_27_0,
    #label_input_27_2 {
     color: red;
    }

    #input_27_0:checked + label,
    #input_27_2:checked + label {
     color: black;
    }

    95v3k.png