Title: Making the calculated fields responsive
Last modified: March 4, 2025

---

# Making the calculated fields responsive

 *  Resolved [blue](https://wordpress.org/support/users/life2/)
 * (@life2)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/)
 * Hi, How do I make a calculated field responsive just like the instruct text field(
   after making its width larger)?

Viewing 7 replies - 1 through 7 (of 7 total)

 *  Plugin Author [CodePeople2](https://wordpress.org/support/users/codepeople2/)
 * (@codepeople2)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/#post-18340161)
 * Hello [@life2](https://wordpress.org/support/users/life2/)
 * I guess you are referring to the equations’ results. The calculated fields use
   input tags. The input tags do not support multiline texts. So, the alternative
   is to use the calculated field to calculate the results, but display them in 
   another control.
 * Assuming the calculated field is the fieldname123, insert an “HTML Content” field
   in the form and enter a DIV tag (or any other tag) in its content with the `data-
   cff-field` attribute indicating the field whose value you want to display within
   the tag.
 * E.g.
 *     ```wp-block-code
       <div data-cff-field="fieldname123"></div>
       ```
   
 * Finally, as the calculated field is used as an auxiliary, you can hide it by 
   ticking a checkbox in its settings.
 * Best regards.
 *  Thread Starter [blue](https://wordpress.org/support/users/life2/)
 * (@life2)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/#post-18340194)
 * Okay, that works, thank you.
 * There are also two issues with the reset button:
    1. The HTML field that lists the content of calculated field does not get empty
       after resetting even though the original calculated field becomes empty.
    2. Initially, the form loads properly with all the needed fields. After resetting,
       some fields (that use custom dependency rules) disappear. Then, I have to toggle
       between the choices to show those fields again.
 * Please advise on how to fix these two problems.
 * Thanks.
 *  Plugin Author [CodePeople2](https://wordpress.org/support/users/codepeople2/)
 * (@codepeople2)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/#post-18340696)
 * Hello [@life2](https://wordpress.org/support/users/life2/)
 * Could you please provide the link to the page containing the form to check it
   in detail?
 * I’m testing the issues you describe on my end and the reset is working properly.
   Please watch the following video:
 * [https://resources.developers4web.com/cff/tmp/2025/03/04/video_o.mp4](https://resources.developers4web.com/cff/tmp/2025/03/04/video_o.mp4)
 * Best regards.
 *  Thread Starter [blue](https://wordpress.org/support/users/life2/)
 * (@life2)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/#post-18342368)
 * I was able to resolve the two problems. But, the showing/hiding of fields based
   on custom dependency rules seem to be slow and sometimes requires clicking on
   the page. Is there a reason for this?
 *  Thread Starter [blue](https://wordpress.org/support/users/life2/)
 * (@life2)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/#post-18342378)
 * I’m doing something like this:
 *     ```wp-block-code
       if(fieldname1 == 9) AND(ACTIVATEFIELD(fieldname2|n), ACTIVATEFIELD(fieldname3|n), ACTIVATEFIELD(fieldname4|n), IGNOREFIELD(fieldname5|n), IGNOREFIELD(fieldname6|n), IGNOREFIELD(fieldname7|n));else return AND(IGNOREFIELD(fieldname2|n), IGNOREFIELD(fieldname3|n), IGNOREFIELD(fieldname4|n), ACTIVATEFIELD(fieldname5|n), ACTIVATEFIELD(fieldname6|n), ACTIVATEFIELD(fieldname7|n));
       ```
   
 *  Plugin Author [CodePeople2](https://wordpress.org/support/users/codepeople2/)
 * (@codepeople2)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/#post-18342384)
 * Hello [@life2](https://wordpress.org/support/users/life2/)
 * It depends on how you implemented the form and configured the dependencies. When
   you reset the form, the plugin must reevaluate all the equations.
 * The piece of code you included in your entry is incorrect, please rewrite it 
   as follows:
 *     ```wp-block-code
       (function(){if(fieldname1 == 9) {  ACTIVATEFIELD(fieldname2|n);  ACTIVATEFIELD(fieldname3|n);  ACTIVATEFIELD(fieldname4|n);  IGNOREFIELD(fieldname5|n);  IGNOREFIELD(fieldname6|n);  IGNOREFIELD(fieldname7|n);} else {  IGNOREFIELD(fieldname2|n);  IGNOREFIELD(fieldname3|n);  IGNOREFIELD(fieldname4|n);  ACTIVATEFIELD(fieldname5|n);  ACTIVATEFIELD(fieldname6|n);  ACTIVATEFIELD(fieldname7|n);}})()
       ```
   
 * Best regards.
 *  Thread Starter [blue](https://wordpress.org/support/users/life2/)
 * (@life2)
 * [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/#post-18342420)
 * Okay, thank you, this might be the cause of the problems I have with resetting.
   I will modify the code and check again.

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Making the calculated fields responsive’ is closed to new replies.

 * ![](https://ps.w.org/calculated-fields-form/assets/icon-256x256.jpg?rev=1734377)
 * [Calculated Fields Form](https://wordpress.org/plugins/calculated-fields-form/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/calculated-fields-form/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/calculated-fields-form/)
 * [Active Topics](https://wordpress.org/support/plugin/calculated-fields-form/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/calculated-fields-form/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/calculated-fields-form/reviews/)

 * 7 replies
 * 2 participants
 * Last reply from: [blue](https://wordpress.org/support/users/life2/)
 * Last activity: [1 year, 3 months ago](https://wordpress.org/support/topic/making-the-calculated-fields-responsive/#post-18342420)
 * Status: resolved