Implementing Dependencies for Radio Button and Checkbox

Hello @mushiepops

The issue are not the dependencies, the issue is the control you are using. The radio buttons accept to select only one choice at once. so, if you select Vegetables, the Fruits would be unticked and all its dependent fields disabled. If you want the users can select between multiple choices, you should use a checkbox field instead a radio button.

Concerning to your second question, you are talking about two different plugins, with the professional version of the “Calculated Fields Form” plugin, you can send notification emails without needing additional forms or plugins.

Best regards.

Hi,

I tried checkbox and it works well but I want to show sub-categories from one category at a time, like radio button does. In checkboxes once I selected another category, the subcategories of the category I selected prior remained open. And if I deselected it, it’s hidden. I want the ability to show sub-categories one at a time but retaining the number field. Is this possible with checkbox or at all?

So I guess it isn’t possible to send email with free version. Thank you for clarifying.

Kinds Regards! And thank you again.

Hello @mushiepops

You want simply show/hide fields, but the dependencies is more than show/hide fields. If a field is configured as dependent and it is disabled, the field will be hidden and totally ignored. This mean the field won’t be submitted, and its value ignored from the equations.

If you want simply show/hide fields, you should implement this behavior by yourself programmatically.

– Assuming there is a radio button, fieldname1, with the choices: A and B
– Furthermore, you have two DIV fields: the fieldname2 field containing the fields you want to display when the choice A is ticked, and the fieldname3 field containing the fields corresponding to the choice with the value B

1. Assign to the fieldname2 field the custom class name: my-field-a, and the predefined class name: hide

2. Assign to the fieldname3 field the custom class name: my-field-b, and the predefined class name hide

Note: the class names are associated to the fields through their attributes: “Add CSS Layout Keyword”. Furthermore, if it is needed to assign to a same field multiple class names, like in this case, separate them by a blank character.

3. Finally, insert a calculated field in the form as auxiliary, with a piece of code similar to the following one as its equation:

(function(){
jQuery('.my-field-a,.my-field-b').addClass('hide');
if(fieldname1 == 'A') jQuery('.my-field-a').removeClass('hide');
if(fieldname1 == 'B') jQuery('.my-field-b').removeClass('hide');
})()

and that’s all.
Best regards.