Fix autocomplete when used in bootstrap modal #2058
Conversation
Right now, the bootstrap modal dialogs use a z-index of 1055, so the autocomplete list shows behind the dialog. https://github.com/twbs/bootstrap/blob/a9b34450601b017b27cacd9ff750aa9c12aac82c/scss/_variables.scss#L1042 This change will put the z-index that will work with bootstrap and align with the bootstrap toast z-index.
|
|
|
Thanks for the report. Does the issue you describe exist when jQuery UI 1.12.1 is used or only with jQuery UI 1.13.0 or newer? |
|
@ejohnson-dotnet Uhhh we can't just change the z-index CSS statement that is used for ALL stack related stuff in UI. This will pretty sure a breaking change for most users. It even breaks the tests. I guess this is something you will need to fix for your specific use case. |
|
Sure I get it. I was just trying to find a fix for this issue. I have fixed it locally for my project. It just means I need to always edit the z-index for jquery-ui when updating. I know others have the same problem too. The root cause is that Bootstrap has chosen a value of 1050 for the modal z-index. jquery-ui has chosen a value of 100 for the z-index. The tests for jquery-ui failed because the test is simply hardcoding 100 also. If there is a better solution that would be great. Thanks for looking at it at least. |
Right now, the bootstrap modal dialogs use a z-index of 1055, so the autocomplete list shows behind the dialog. https://github.com/twbs/bootstrap/blob/a9b34450601b017b27cacd9ff750aa9c12aac82c/scss/_variables.scss#L1042
This change will put the z-index that will work with bootstrap and align with the bootstrap toast z-index.