Display a div on Thank You page based on input value

Hello,

The process would be simple, I’ll try to explain it with an example.

Assuming that the field in the form is the fieldname1, and the <div id="my_div" style="display:none;">your information here</div> tag in the thank you page has the id="my_div" and it is hidden by default (style="display:none")

Insert the shortcode for the summary in the thank you page as follows:

[CP_CALCULATED_FIELDS_RESULT]<script>jQuery(function(){
if('<%fieldname1%>' == 1) jQuery('#my_div').show();
});</script>[/CP_CALCULATED_FIELDS_RESULT]

and that’s all, the code checks if the value of the fieldname1 is 1 and shows the DIV tag.

If the <DIV></DIV> tag is created with fields in the form, you should include it into the shortcode:

[CP_CALCULATED_FIELDS_RESULT]<div id="my_div" style="display:none;">your information here</div><script>jQuery(function(){
if('<%fieldname1%>' == 1) jQuery('#my_div').show();
});</script>[/CP_CALCULATED_FIELDS_RESULT]

Best regards.

Something isn’t working within this solution. Each time I add the code above to my thank you page, it causes the existing functions of my [CP_CALCULATED_FIELDS_RESULT] to break.

The first from is here: https://solarpowerrocks.com/texas-solar-programs/

The page where I’m trying to use the code is here: https://solarpowerrocks.com/texas-solar-programs-2/

The [CP_CALCULATED_FIELDS_RESULT] code on the second page is designed to move the city, state, and ZIP from one form to another, and also to trigger the hidden div (id=”hideforbad”) if fieldname9 from the earlier form == 0. (in this case, to test)

Please advise.

Hello,

In a same thank you page it is possible to insert multiple [CP_CALCULATED_FIELDS_RESULT] … [/CP_CALCULATED_FIELDS_RESULT] blocks (not nested of course).

Could you indicate exactly the code you are inserting in the thank you page please?

Best regards.

I’ve tried a few variations on this code, including making two, not nested blocks. Here is the most recent non-working code:

[CP_CALCULATED_FIELDS_RESULT]
<script>jQuery(function(){
if(‘< %fieldname9%>’ == 0) jQuery(‘#hideforbad’).show();
});</script>
<script>
cpcff_default = { 1 : {} };
cpcff_default[1][ ‘fieldname19’ ] = ‘< %fieldname10_value%>’;
cpcff_default[1][ ‘fieldname20’ ] = ‘< %fieldname11_value%>’;
cpcff_default[1][ ‘fieldname21’ ] = ‘< %fieldname3_value%>’;
cpcff_default[1][ ‘fieldname22’ ] = ‘< %fieldname6_value%>’;
cpcff_default[1][ ‘fieldname39’ ] = ‘< %fieldname9_value%>’;
</script>
[/CP_CALCULATED_FIELDS_RESULT]

I’ve also tried it with just one “<script>” tag, while removing the “});”

Thanks for your assistance.

Hello,

My apologies, was my error in the piece of code I sent you in a previous ticket:

The conditional statement:

if('<%fieldname9%>' == 0) jQuery('#hideforbad').show();

should be edited as follows:

if('<%fieldname9_value%>' == 0) jQuery('#hideforbad').show();

The complete code would be:

[CP_CALCULATED_FIELDS_RESULT]
<script>jQuery(function(){
if('<%fieldname9_value%>' == 0) jQuery('#hideforbad').show();
});
cpcff_default = { 1 : {} };
cpcff_default[1][ 'fieldname19' ] = '<%fieldname10_value%>';
cpcff_default[1][ 'fieldname20' ] = '<%fieldname11_value%>';
cpcff_default[1][ 'fieldname21' ] = '<%fieldname3_value%>';
cpcff_default[1][ 'fieldname22' ] = '<%fieldname6_value%>';
cpcff_default[1][ 'fieldname39' ] = '<%fieldname9_value%>';
</script>
[/CP_CALCULATED_FIELDS_RESULT]

Best regards.

Brilliant, thanks!