Dropdown in Forminator form on Hustle pop up not working

I’m having an issue with a Forminator form drop down not showing correctly in a Hustle pop up on this page (click on “Complete our Safeside Enquiry Form”:wink::

https://www.w****.net/our-services/safeside/smart-choices/

The form actually can pop up from several pages that we have a button on that triggers the form.

However, in all cases, the first question, a select drop down, appears to come up greyed out behind the form, rather than on the form itself, preventing you from selecting an option.

  • Sanowar Prince
    • Staff

    Hi James Round,

    Hope you’re doing good today.

    I had a closer look on your issue and after a little investigation I found that it was CSS z-index issue.

    To fix the issue, I added the following CSS code on your wp-admin > Appearance > Customize > Additional CSS.

    .select2-container { z-index: 999999; }

    Please check your site and let us know if it works for you as well.

    Best regards,

    Sanowar

  • James Round
    • Flash Drive

    Hi there,

    Thanks for this, that appears to have fixed the problem on this page.

    Can you confirm what has actually caused this issue?

    Also, this pop-up works on several pages, I assume that the fix in place will correct it on any instance on the site, not just the original page I quoted in the live chat?

    Many thanks

  • Sanowar Prince
    • Staff

    Hi James Round,

    I am extremely sorry for the delayed reply.

    Yes, the fix I provided earlier would work on all pages.

    Drop-down on your form is rendered when clicked on it by a script select2.js which is causing the issue. I am not sure from where that script is loading. I also noticed, you are using Forminator Pro v1.8 which is outdated. You could try to update it to latest version which is v1.9.1.

    I tested the issue on my test site and it worked fine on my end.

    To identify the issue, I would suggest you to run a full plugin conflict test. Before running the test, please create a recent backup in case you lose any settings during the test and have to restore to a previous working state.

    Then deactivate all plugins and MU-plugins apart from WPMU DEV Dashboard, Hustle Pro and Forminator Pro, activate a default theme like Twenty Seventeen, clear all caches and check again if the issue is still there. If not, it means that something is conflicting, so start activating the remaining plugins and theme, one by one this time, checking every time for the reported issue, until you reproduce the issue, thus finding the conflicted combination. The following flowchart image can assist you during this test: https://premium.wpmudev.org/wp-content/uploads/2015/09/Support-Process-Support-Process.gif

    As this is a live website with traffic, I’d rather advise to create a staging environment, meaning a complete and exact copy of this installation into another location/folder in the same server, using a separate database, and perform the test in there instead without worrying about the live site.

    After following the above steps if the issue still exist, please let us know by replying here so we could investigate further on your issue.

    Best regards,
    Sanowar

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.