google-maps

Google maps autocomplete option not clickable inside modal


I am using google maps autocomplete in my project. This works well on normal page.

But inside a modal Google maps autocomplete option is not clickable. When mouseover on an option, it is highlighting the textfield below it and the option is not clickable. Image attached

enter image description here

As you can see suburb textfield is getting highlighted when i place mouse over an google map address option(Smith street). The only way i could select an address is by using down arrow.

I don't think this is an zindex issue. Any idea on how to fix this?


Solution

  • Adding pointer-events: all solved the issue