Result Screen

Hello @klingbeil

Thank you very much for using our plugin. If you want to display the result embedded in another text, as part of your form, you can insert an HTML Content field and enter the text in its content similar to:

Your Calculation Result: <span data-cff-field="fieldname1"></span>

(Assuming the fieldname1 is the calculated field)

If you want to submit the form and redirect the user to another page to display the equations’ results and the summary of the information collected, you will need the professional version of the plugin:

https://cff.dwbooster.com/documentation#thanks-page

Best regards.

Hello,
I’m thinking of a big project with this plugin. I’m trying to solve only the form styles with every detail considered. Sincerely thanks for this nice plugin.

I have one more question;
You said above to write the result in the text field. Well, apart from the form shortcut we designed; Can we write the result independent of the form between any div table on the page?

Thanks.

Hello @klingbeil

The plugin includes the “Customize Form Design” attribute in the “Form Settings” tab (https://resources.developers4web.com/cff/images/documentation/form-settings-tab.png). It is a CSS editor with syntax highlighting and error checking to allow you to customize the form designs by entering your CSS blocks of code. Learn more about the forms and fields components and how to customize their appearance by reading the following blog post:

https://cff.dwbooster.com/blog/2020/01/12/form-design

Also, if you want to apply the same styles to multiple forms on your website, you can create a custom template and select them from the “Form Settings” tab (https://cff.dwbooster.com/blog/2021/09/27/create-new-form-template)

Responding to your second question, if you want to display the equation’s result in any other tag on the page, you can use a piece of javascript as part of the equation. I’ll try to describe the process with a hypothetical example.

Assuming you have a calculated field with the equation fieldname1+fieldname2 and want to display the result into a DIV tag on the page with id result-container. You can edit the equation as follows:

(function(){
var result = fieldname1+fieldname2;
jQuery('#result-container').html(result);
return result;
})()

Best regards.

Hi, it’s actually not a separate page. I may have misunderstood this part.

Consider 2 table cells side by side on the same page.

1. I added the calculation shortcut to the table cell.
   ([CP_CALCULATED_FIELDS id=”1″])
   and I brought the form.
   I will try to print the result independently in the 2nd table cell ([CP_CALCULATED_FIELDS id=”1″]).
   Example: Your Calorie Result: 25

Make WordPress

Actually, it is not a different page, but independent of the form. If I can find the answer to this question, I will be very grateful to you and I will not ask any more questions.
Thanks.

<table border="1">
	<tr>
		<td> [CP_CALCULATED_FIELDS id="1"] </td>
   </tr>
   <tr>
		<td> calculation result </td>

	</tr>
</table>

How can I write the result in the calculation result section.

I hope I was able to explain my problem.

Thanks.

Hello @klingbeil

I’m not talking about a different page. I’m referring to any other tag on the page.

In your case, you can edit the tag

<td> calculation result </td>

As follows

<td id="calculation-result"></td>

And the hypothetical equation would be:

(function(){
var result = fieldname1+fieldname2;
jQuery('#calculation-result').html(result);
return result;
})()

Best regards.

I’ve been trying for a few hours, I couldn’t. Could you please send an example that I can run by adding html code on the wordpress page?

I set the shortcut id part.
A simple addition and subtraction is sufficient.

I couldn’t solve the java part ??

If I fully understand the logic, I’ll take care of the rest.

Hello @klingbeil

In WordPress pages, you can insert HTML tags in the page by using the “Custom HTML” block, but this subject is not related to our plugin.

As I described in the two previous entries, if you insert a piece of HTML code in the page by using the “Custom HTML” block (https://wordpress.com/support/wordpress-editor/blocks/custom-html-block/), like:

<div id="calculation-result"></div>

You can modify its content at the runtime from the equation:

(function(){
var result = fieldname1+fieldname2;
jQuery('#calculation-result').html(result);
return result;
})()

Best regards.

Hello;
I tried to do it step by step as you said.

1. Step

2. step

It cannot write the result to the div you have given.
Where am I going wrong?
Thanks.

Additional Note: I’ve given you a lot of trouble, I’m trying to learn, I’m in the last part.

Hello @klingbeil

In the “Set Equation” attribute of the Calculated Fields, you must enter the equation directly without the <script></script> tags. Also, in the HTML, you should not use the same id on multiple elements. If you want to display the equation’s result in multiple tags, you can assign class names and modify the selector in the equation. Please, watch the following video:

https://resources.developers4web.com/cff/tmp/2023/04/15/video-form_o.mp4

Best regards.

I have never seen a software developer who supports his work as much as you.

Thank you very much sincerely.

thank you

• This reply was modified 1 year, 7 months ago by klingbeil.

Hello, we were able to write the result to the right block with the code at the bottom without any problems.
But when we say reset, it just resets the form content. Do we have a chance to reset the results in the right column?
Thanks.

(function(){
var result = fieldname1+fieldname2;
jQuery('#result-container').html(result);
return result;
})()

Hello @klingbeil

When you press the reset button, the plugin evaluates the equation, resetting the tag content too. However, if the sum result is zero var result = fieldname1+fieldname2; the information in the tag will be zero jQuery('#result-container').html(result);

So, you have two alternatives:

You can check if the value is zero before the assignment:

(function(){
var result = fieldname1+fieldname2;
jQuery('#result-container').html( IF(result, result, '') );
return result;
})()

Or, you can enter the following piece of code in the onclick event of the reset button:

setTimeout(function(){jQuery('#result-container').html('');},50);

The previous code removes the tag content after resetting the form and evaluating the equations.

Best regards.

setTimeout(function(){jQuery('#result-container').html('');},50);

This code worked for me.
Well, if I have more than one value, on the clear button..
What should we do?

‘#result-container1’

‘#result-container2’

setTimeout(function(){
    jQuery('#calculation-fazlamesai1').html('');
    jQuery('#calculation-fazlamesai2').html('');
    jQuery('#calculation-fazlamesai3').html('');
    jQuery('#calculation-fazlamesai4').html('');
}, 50);

it’s done thanks