Dropdown not opening

Hi @combinez,

Sorry to know that you are experiencing this issue.

I suspect that something at the theme end is causing a conflict and causing the issue. Please change the theme to a default WordPress theme like Twenty Twenty-Two and check if you can still replicate the issue.

Please let us know the result so we can help you further.

Kind Regards,
Nebu John

It is working on Twenty-TwentyOne but not on my theme “BookYourTravel”

Can you help me solve it? I don’t know what’s conflicting. I tried my best but failed..

Here’s an example, If I press “Tab” button to go to any dropdown field, it shows some weird design and clicking on it will open the dropdown..

But directly neither it will show that weird design nor it will open dropdown..

Please help me fix this ASAP. Thank You!

Hi @combinez

There’s this script file loaded by your theme “/jquery.js?ver=6.0.2” and it generates and error due to this line

jQuery.document.ready(function() {

I cannot tell for sure if this is affecting the issue but it is specific to your theme and related to Forminator so it’d be worth to start with fixing that so try replacing this line with

jQuery(document).ready(function() {

If that alone doesn’t solve the problem then we’ll need to look through the JS files of the theme as most likely there’s where the conflict is. If it’s your custom theme (and above change doesn’t help), would you be able to share the theme as a zip file with us to test on our end?

To share it you’d need to upload it to your Google Drive, Dropbox or similar account and post direct download link in response here.

Best regards,
Adam

Hi,
It didn’t work.

Here is the link to my current activated theme as well as it’s child theme.

Themes ZIP

Waiting your earliest response and I thank you very much indeed in advance.

Okay just an updated.

After playing around and inspecting a lot, I have applied the below CSS.

.forminator-field div.selector{
	overflow: initial;
}
.forminator-ui.forminator-custom-form[data-design=default] select.forminator-select2+.forminator-select{
	position:absolute;
	top:0;
}

You’re requested to visit the form page again. I’m still experiencing issues with css and displays and trying to solve it and will update here once it is solved too.

Update..

This was the whole css I had to apply to override some style conflicts and now all seems working perfectly..

.forminator-field div.selector{
	overflow: initial;
}
.forminator-ui.forminator-custom-form[data-design=default] select.forminator-select2+.forminator-select{
	position:absolute;
	top:0;
}

.et-db #et-boc .et_pb_module .forminator-ui.forminator-custom-form[data-design=default] select.forminator-select2+.forminator-select, .forminator-ui.forminator-custom-form[data-design=default] select.forminator-select2+.forminator-select {
    min-width: 100%;
    max-width: 100%;
    display: block;
    text-align: left;
    position: absolute;
    left: 0;
}

.forminator-ui#forminator-module-1027.forminator-design--default .forminator-select2 + .forminator-select .selection .select2-selection--single[role="combobox"] .select2-selection__arrow {
    width: 10px !important;
}
.forminator-ui.forminator-custom-form[data-design=default] select.forminator-select2+.forminator-select .selection {
    padding-right: 0px;
}

.forminator-ui.forminator-custom-form[data-design=default] select.forminator-select2+.forminator-select {
    padding-right: 0px;
}
 .forminator-ui.forminator-custom-form[data-design=default] select.forminator-select2+.forminator-select .selection span[role=combobox].select2-selection--single .select2-selection__arrow {
	 display:none !important;
}