ukrbublik / react-awesome-query-builder

User-friendly query builder for React
https://ukrbublik.github.io/react-awesome-query-builder
MIT License
2.01k stars 499 forks source link

Help setting up Bootstrap theme #705

Closed nardove closed 1 year ago

nardove commented 2 years ago

After installing the dependencies for reactstrap and bootstrap I tried to setup the theme using the BootstrapConfig option, but when I do so the first element to select from the dropdown does not work properly, see below

Screenshot 2022-06-09 at 16 07 03

And the component does not open to select from the list, when I inspect the DOM it has no elements to select from

Screenshot 2022-06-09 at 16 28 03

But when I use the BasicConfig, it works fine, see below

Screenshot 2022-06-09 at 16 08 35

I wonder if there is an extra step to setup Bootstrap that is not in the demos or docs?

UPDATE I've also noticed that the selection input does work, but if the query component is inside a Modal, the dropdow component renders behind the modal background

nardove commented 2 years ago

I think the problem relies on the component being inside a Modal component, as I can see the dropdown underneath the Modal body

Cyrelc commented 1 year ago

I had the same issue and can confirm @nardove is correct - you have to go manually give it a higher z index