Modal Bootstrap window does not display styles in components - Asp.net MVC

Question

I have a problem that I haven’t been able to solve in months! I’m using a package of bootstrap and JS styles, in which they refer to my _Layout. On all pages that are rendered and inherited from the Main page, everything works smoothly. As soon as I opened the windows in modal, the problems began to arise... Note that the Dropdown in the Index page is stylized correctly, but the same dropdown in the Create view does not work.

For my modals to work, my controller returns a "Create" View, but when it is loaded in the modal (Situated in Index), I need to play null for the Layout property, otherwise the window won’t open. (This could be a problem). I tried to open the Modals using Partialviews, but it also doesn’t work...

I’ll leave the link to anyone who wants to take a look at the project: https://onedrive.live.com/? id=40838E65B9F8787E%21120&Cid=40838E65B9F8787E

Answer 1

Person, after much exhausting research and patience I found the solution on this site: Problem solving

All I had to do was add the script below:

<script>
    $('#mySelect2').selectpicker({
        dropdownParent: $('#modalGenerica')
    });
</script>

Therefore, the response of fellow @Adriano Praia was the closest.

Thank you all for your help!

Answer 2

Your problem with CSS,

shall increase the z-index of the modal element

Answer 3

Dude, there was a similar problem but using the datepicker and Select2 component, I added it in partial to solve this problem.

<script>
$(document).ready(function () {
    $('.select2').select2();

    $('.datepicker').datepicker({
        format: 'dd/mm/yyyy',
        language: 'pt-BR',
        todayBtn: "linked",
        autoclose: true,
        todayHighlight: true,
    });
});
</script>