Jump to content

Form JQuery Not Working When Lightbox Is Used

Recommended Posts

Hi there,

I have injected some JQuery code into my page in order to set a few conditional fields within a form. The conditional fields are triggered depending on the selection from a radio button as shown below:

1121343217_Screenshot2022-01-25at09_54_17.thumb.png.ab680cf50a0ba12ac06bc37bfa62884c.png

As you can see when a number other than 0 is selected the conditional fields get displayed.

631115611_Screenshot2022-01-25at09_54_33.thumb.png.44350974391ece11fe87f6600d738215.png

The form works perfectly as expected but the problem is when I switch to form to a lightbox the JQuery seems to stop working and the conditional fields do not appear, no matter the selection.

1770270005_Screenshot2022-01-25at09_55_06.thumb.png.0174541b361b8b2148b98ba9745aa719.png

What am I missing here? Any help on this would be appreciated 🙂 

 

Link to comment

The code must wait until the form has loaded, not the page. When the form is on the page, both load at the same time but when it is a lightbox form it won't be added to the page until the form is launched.

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

Link to comment
19 hours ago, paul2009 said:

The code must wait until the form has loaded, not the page. When the form is on the page, both load at the same time but when it is a lightbox form it won't be added to the page until the form is launched.

Thanks Paul, would you have an example of code that would work for recognising if the form is launched or not? I have tried these examples below so far:

$('#yui_3_17_2_1_1643211118624_394').on( "load", function() {
        
});
if($('#yui_3_17_2_1_1643211118624_394').is(':visible')){

}

 

Link to comment

It's more complex than that 🙂. You'll need a Mutation Observer to detect the changes. 

Improve your online store with our extensions.
About: Squarespace Circle Leader since 2017. I value honesty, transparency, appreciation and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™.
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Buy me a coffee

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.