GravityForm 2.5 conditionals are not working with the GeneratePress theme

When I revert to a different theme all my GravityForm version 2.5 conditionals work. I had to hire a developer thinking it was my forms and took 5th developer to figure out and proved to methat it was the GeneratePress theme. I really would like help with solution as soon as possible please.

Hi there,

We're actually using Gravity Forms 2.5 with conditionals for our support ticketing over on our GenerateBlocks website - we haven't noticed any issues.

Can you expand on what exactly isn't working? Any chance you can link us to an example page so we can see the issue?

Thanks!

Sure
This is going to be my new site using GeneratePress (form link)
https://allabouthomecleaning.com.au/aahc/estimate/?interval=weekly
STEP > 0%

STEP > 25%
Booking? > Online | Phone |Schedule
1. "Schedule" Conditional should only show "Required Date(Required)" and "Required Time(Required)"
2. "Phone" Conditional should only show "Meeting Date" and "Meeting Time (10min)"

STEP > 50%
Invoice Made To > Home | Business | Insurer
1. Conditionals are totally screwed up

Forms are exactly same. This is one form I have 4 but issue is the same.
You can compare this with my current live site using HelpMate Theme > https://allabouthomecleaning.com.au/estimate/?interval=weekly

Hi Thanks for looking in to this.
I have removed the JavaScript completely from RECURRING GF forms and it did not make any difference. Issue remains. Below the Javascript you have mentioned that I have removed. Since my test I placed it back again. There must be something else. I also today updated the new GF 2.5.4 but still issue remains.

jQuery(window).scroll(function(e){
var $el = jQuery('.gf_rightside');
var isPositionFixed = ($el.css('position') == 'fixed');
if (jQuery(this).scrollTop() > 20 ){
$el.css({'top': '150px'});
}
if (jQuery(this).scrollTop() < 20 ){
$el.css({'top': '250px'});
}
});

jQuery(window).scroll(() => {
topOfFooter = jQuery('#footer').position().top;
scrollDistanceFromTopOfDoc = jQuery(document).scrollTop() + 600;
scrollDistanceFromTopOfFooter = scrollDistanceFromTopOfDoc - topOfFooter;

if (scrollDistanceFromTopOfDoc > topOfFooter) {
jQuery('.gf_rightside').css('margin-top', 0 - scrollDistanceFromTopOfFooter);
} else {
jQuery('.gf_rightside').css('margin-top', 0);
}
});

I'm seeing this javascript error when I get to the problem step: https://www.screencast.com/t/dV8hFUSbc1p

That's likely preventing the rest of the javascript on the page (used for conditions) to fail.

Looking at it, the error seems to be directly related to Gravity Forms itself - not the theme. Have you reported it to them to see if it's something they're aware of?

Specifically, it's looking for a #footer element, which doesn't exist in GP:

topOfFooter = jQuery('#footer').position().top;

The above will result in a javascript error if #footer doesn't exist on the page.

If I use my GeneratePress child theme with my own CSS styling (see below) Conditional does not work.
==================================

I don't believe this would be a CSS issue.

Does the issue exist with the parent theme?

Issue does not exists with the parent theme (without any customisation CSS)
Using the same customisation CSS child theme for another theme like HelpMate theme works 100%

You can check it working with HelpMate child theme (second page of the RECURRING GF form) at https://allabouthomecleaning.com.au/estimate/?interval=weekly

Not working with GeneratePress child theme (second page of the RECURRING GF form) at https://allabouthomecleaning.com.au/aahc/estimate/?interval=weekly

Hi Folks, hope you don't mind me jumping in as an active GF user.

Since 2.5 came out a few weeks ago, there have been a fair few updates.
The current is 2.5.4.1 (27th) - I suggest you ensure that yours is up to date.
If you look in the change-logs there is mention of JavaScript issues that are now resolved

HTH, Dave

Thanks Dave Ialready have 2.5.4 not sure about the 2.5.4.1 as my GF status is only showing 2.5.4 with a green thick indicates that is current version. How do you donload 2.5.4.1?

Just login to your Gravity Forms account and download the zip file.
Then install it (WordPress will now allow a plugin to be updated via manual upload even though a previous version is already installed)
Dave

Issue does not exists with the parent theme (without any customisation CSS)

In that case then just try eliminate your custom function and CSS one by one to identify the issue that way.

Ok after a few experimentation It looks like following lines causing the error. But To get the styling correct I need those lines.. Not sure what todonow.

.gform_wrapper.gravity-theme .gfield.gfield--width-third {
display: inline-block!important;
}
.gform_wrapper.gravity-theme .gfield.gfield--width-quarter{
display: inline-block!important;
}
.gform_wrapper.gravity-theme .gfield.gfield--width-half{
display: inline-block!important;
}
.gform_wrapper.gravity-theme .gfield-choice-input+label{
max-width: calc(100% - 0px)!important;
}

Hi there,

are those Fields within a wrapper ? If so you're better off add Flexbox CSS to the wrapper to inline those elements - that way elements can still remain hidden until required.