How to close Bootstrap Modal?

Asked

Viewed 211 times

1

Before anything I say I read other posts... Close modal when you click the button

I am developing a system in ASP NET Core and using a modal of bootstrap to log in. I sent the data to the controller by javascript and Validei...

$("#btn-entrar").click(function () {

        var email = $("#inputEmail").val();
        var senha = $("#inputPassword").val();

        $.ajax({
            url: "/Home/Logar",
            type: "POST",
            data: {
                email: email, senha: senha
            },
            success: function (data) {
                if (!data.hasOwnProperty("erro")) {
                    var contaUsuario = document.getElementById('usuLogado');
                    contaUsuario.style.display = "inline";
                    $('#modalLogin').modal('hide');
                }
                else {
                    alert(data.erro);
                }
            }

        })

    })

The problem is that the modal.('Hide') is not working 100%...explaining... When the modal opens it superimposes the main page and fades (leaves gray, without focus) the page behind, correct? My modal.('Hide') Yes the modal closes, but does not restore the focus on the page...I can not click anything.

javascript asp.net-mvc bootstrap-4 asp-net-core

  • Joelend, is that there is another div opening to "blur" (give dark effect) the site, you will need to check in your inspect element which div this to be able to close, or if you want, you can send here in the question the complete code of the modal so I can help xD

  • Yes...I just saw, there is a div...?

  • You can put the example of your code here, the modal?

  • the div is this: <div class="modal-backdrop fade show"></div>

1 answer

1

The dark background behind the modal and above the general content of the page is a div with class .modal-backdrop which is generated when the modal is opened. When the modal is closed, this div is simply removed from the DOM (from the page).

The normal is that this occurs naturally, ie: closes the modal, the backdrop some. But you can remove it manually with the following code:

$(".modal-backdrop").remove();

It’s not to hide him, it’s to remove same, because, as said, when opening the modal again, a new backdrop is generated.

Browser other questions tagged javascript asp.net-mvc bootstrap-4 asp-net-core

You are not signed in. Login or sign up in order to post.