Creé un formulario y un controlador JQuery Ajax para manejar el inicio de sesión.
Bajo mi formulario, he creado una ventana emergente div de arranque que dice "Nombre de usuario o contraseña incorrectos". Quiero ocultarlo usando JQuery $().hide() y mi secuencia de comandos Handler mostrará la ventana emergente div si el nombre de usuario y la contraseña no están en la base de datos.

Esta es la ventana emergente div

 <div id="error" class=" col-sm-3 mx-auto mt-4 alert alert-danger alert-dismissible fade show" role="alert"> <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> Password or username incorrect. </div>

Este es mi script JS

 $(`div#error`).hide(); //handling login form. $("#login-form").submit(function(e){ if($('#user').val() != "" && $('#psw').val() != "" && $('#npsw').val() != "") { $.ajax({ type: "POST", url: "login-process.php", data: $("#login-form").serialize(), success: function(response){ $('#login-form')[0].reset(); console.log(response); if (response == "True") { window.location.href = "info.php"; } else { $(`div#error`).show(); } } }); } else { alert("Please fill the fields.") } e.preventDefault(); });

El problema: la ventana emergente div se muestra en la página y no está oculta. Cuando lo cierro manualmente desde el botón cerrar. El controlador no muestra el div si los datos son incorrectos.