Dynamic Checkbox Value

Hello @chrisdias96

I’m not sure about your question. However, I’ll try to describe the process with a hypothetical example.

I’ll use the getField operation as part of the equation. getField receives the numeric part of a field’s name as a parameter and returns an object representation of the field. This object includes the setChoices method in the checkbox, radio buttons, and dropdown fields to generate the fields’ choices at the runtime.

So, assuming you have the checkbox field, fieldname123, and you want to generate three choices as follows:

First choice:
Text: A
Value: fieldname1+fieldname2

Second choice:
Text: B
Value: fieldname3+fieldname4

Third choice:
Text: C
Value: fieldname1*fieldname4

Note that the fields’ names, texts, and operations are hypothetical.

The equation associated with the calculated field that is used as an auxiliary to populate the checkbox field would be:

getField(123).setChoices({texts:['A', 'B', 'C'], values:[fieldname1+fieldname2, fieldname3+fieldname4, fieldname1*fieldname4]});

As you can see, the setChoices operation receives an object as a parameter, with the texts and values properties for the choices’ texts and values, respectively.

Using this logic, you can generate the checkbox choices dynamically at the runtime.

Best regards.

Hello,

Your solution does work, however it only runs when I submit my results. Is there an automatic way of changing the options for dropdown 2 once dropdown 1 is chosen?

I would like to explain my 2 situations incase I was confusing.

I have 2 separate situations.

Situation 1:
I have 3 dropdowns with a series of options.
Dropdown 1 choose a # with multiple of 10.
Dropdown 2: choose a number between 1-8.
Dropdown 3, choose a number between 1-3.

If Dropdown 1 value equals 30, I want dropdown 2 to hide to the #7 as an option. I don’t see how your answer helps solve this.

Situation 2:
Note this is a completely separate question to the above. I just didn’t want to create a separate thread for it.

I have 2 checkboxes (for example, fieldname100 and 101), with an initial value of 100 and 101.
At runtime, if fieldname4 is abc, fieldname100 becomes double, is fieldname5 is def, fieldname101 becomes triple the value. How do I programatically calculate the checkbox value? I didn’t understand this from your answer.

Thanks

• This reply was modified 3 years, 2 months ago by chrisdias96.

Hello @chrisdias96

The solution is the same in both cases. You should generate the choices at the runtime.

No matter if it is a checkbox, radio buttons, or DropDown field:

(function(){
if(fieldname1 == 30) getField(2).setChoices({texts:['A', 'B', 'D'], values: [1,2,4]});
else getField(2).setChoices({texts:['A', 'B', 'C', 'D'], values: [1,2,3,4]});
})()

As you can see above, I’m generating the choices at the runtime based on the value in the fieldname1.

If you prefer to implement a similar behavior by modifying directly the DOM you can use like this one:

(function(){
if(fieldname1 == 30) getField(2).jQueryRef().find('option:eq(2)').hide();
else getField(2).jQueryRef().find('option').show();
})()

Both solutions are similar. They hide the third option in the fieldname2 field based on the value selected in the fieldname1.

About your second question, you should not modify the checkbox value. It would be the same. You should return the equation’s result based on the value of the fieldname4:

(function(){
if(fieldname4 == 'abc') return fieldname100*2;
else return fieldname100;
})()

Best regards.

Hi,

How come the dropdowns options cant change automatically?
It defeats the purpose of hiding some of the options if the user can still choose them before they click submit?

Hello @chrisdias96

By using the setChoices operation, the choice disappears. The user cannot select it.

Best regards.

Hello,

But the choice doesn’t disappear until runtime.

Hypothetically, if I had to input 2 dropdowns; one for country and one for state. It would be possible to choose a country like Australia with a state New York. It wouldn’t be until runtime that it would update.

My solution requires a dynamic update of a calculated field. But if I enable dynamic evaluations then one of my download buttons would break.

What other way can I go about this?

• This reply was modified 3 years, 2 months ago by chrisdias96.

Hello @chrisdias96

If you want to populate the country and states lists dynamically, you can store them into a CSV file and use “DS” fields to read the information from the CSV file.

Please, read the following blog post that describe a similar use case:

https://cff.dwbooster.com/blog/2019/02/14/ds/

Note that this method does not require calculated fields to populate the DropDown or Checkboxes.

Best regards.

Ok thanks I will look into DS fields.

Another thing, Is it possible to choose specific fields that run dynamically or on runtime. I have specific fields that I only want to update on runtime, and some fields I want to be dynamically evaluating at all times?

Hello @chrisdias96

Are you referring to the equation associated with the calculated fields? You can configure the form as a whole to evaluate the equations dynamically or manually, but not both.

If you want to evaluate some equations dynamically and others manually, you can implement some tricks.

1. Configure the form to evaluate the equations dynamically.

2. Use a flag in those equations you want to evaluate manually, for example:

IF(flag, fieldname1+fieldname2, '')

3. Insert a button field in the form to evaluate the previous equation manually. Assuming the calculated field is the fieldname4, enter the following piece of code as the button onclick event:

flag = true; EVALEQUATION(this.form, 'fieldname4'); flag=false;

Best regards.

`(function(){
if(fieldname1 == 30) getField(5).jQueryRef().find(‘option:eq(2)’).hide();
else getField(5).jQueryRef().find(‘option’).show();
})()’

I am attempting to use this code to hide the option as you mentioned in your previous answer, but I cannot get this code to work to change my DOM. I am attempting to hide options in fieldname5.

Hello @chrisdias96

Please, send me the link to the form to check your code in action.

Best regards.

Actually I figured it out.

Thanks for bearing with me.

One last thing, I added a div with 2 columns but don’t see the option to move the fields into each column. The builder just shows one giant row. How do I choose which field goes in which column?

Hello @chrisdias96

The columns are generated at the runtime. Please, press the “Preview” button. The fields are alternated between columns into the div.

If you want to take control of column fields, a workaround would be:

– Insert DIV field with two columns.
– Into the main DIV, insert another two div fields. The first DIV field will correspond to the left column and the second field to the right column.
– Finally, insert the fields into the corresponding DIV field.

Best regards.

Thanks.

Going back to your code at

(function(){
if(fieldname1 == 30) getField(2).setChoices({texts:[‘A’, ‘B’, ‘D’], values: [1,2,4]});
else getField(2).setChoices({texts:[‘A’, ‘B’, ‘C’, ‘D’], values: [1,2,3,4]});
})()

Why does this code freezes the browser and require a restart when running dynamically? Can it only be used on runtime, and why?

Hello @chrisdias96

The browser freezes if you generates an endless loop.

When a field varies its value, the plugin identifies the equations affected and evaluates them. The equations evaluation modifies the calculated fields’ values. So, the plugin should repeat the process to identify the affected equations and evaluate them. The process is repeated again and again until no field varies its value.

So, if you use a field in its own equation, you have created an endless loop, or for example, if you use field A in the equation of field B and field B in the equation of field A. The chain can be longer, field A in the equation of field B, field B in the equation of field C and field C in the equation of field A, closing the circle.

Please, send me the link to your form to check its structure.

Best regards.