I am trying to display a message when deleting a record and after 2 seconds it disappears and redirects me to another page.
I have the following code. It displays the message but it does not disappear and visually it is not very pleasant.
I share the complete code of the sheet where the message should go when deleting the record, at the bottom add the code sent.
<?php
session_start();
if($_SESSION['rol'] != 1)
{
header("location: ./");
}
include "../conexion.php";
if(!empty($_POST))
{
if($_POST['idusuario'] == 1){
header("location: lista_usuarios.php");
mysqli_close($conection);
exit;
}
$idusuario = $_POST['idusuario'];
$query_delete = mysqli_query($conection,"UPDATE usuario SET estatus = 0 WHERE idusuario = $idusuario ");
mysqli_close($conection);
}
if(empty($_REQUEST['id']) || $_REQUEST['id'] == 0 )
{
header("location: lista_usuarios.php");
mysqli_close($conection);
}
else
{
$idusuario = $_REQUEST['id'];
$query = mysqli_query($conection,"SELECT u.nombre,u.usuario,r.rol FROM usuario u INNER JOIN rol r ON u.rol = r.idrol
WHERE u.idusuario = $idusuario ");
mysqli_close($conection);
$result = mysqli_num_rows($query);
if($result > 0)
{
while ($data = mysqli_fetch_array($query))
{
$nombre = $data['nombre'];
$usuario = $data['usuario'];
$rol = $data['rol'];
}
}
else
{
header("location: lista_usuarios.php");
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<?php include "includes/scripts.php"; ?>
<title>Eliminar Usuario</title>
</head>
<body>
<?php include "includes/header.php"; ?>
<section id="container">
<br>
<div class="data_delete">
<br>
<h2><i class="fas fa-user-times"></i> ¿Está seguro de eliminar el siguiente registro?</h2>
<br>
<p>Nombre: <span><?php echo $nombre; ?></span></p>
<p>usuario: <span><?php echo $usuario; ?></span></p>
<p>Tipo Usuario: <span><?php echo $rol; ?></span></p>
<form method="post" action="">
<input type="hidden" name="idusuario" value="<?php echo $idusuario; ?>">
<a href="lista_usuarios.php" class="btn_cancel">Cancelar</a>
<div id="mensaje-emergente"></div>
<button type="submit" class="btn_ok" onclick="ejecutaAlerta()"><i class="fas fa-user-times"></i> Eliminar</button>
</form>
</div>
</section>
<?php include "includes/footer.php"; ?>
<script>
function ejecutaAlerta()
{
/* Localizamos el contenedor y cambiamos el texto */
let mensaje = document.getElementById('mensaje-emergente');
mensaje.innerText = 'Hola StackOverflow!';
/* Hacemos aparecer el mensaje */
mensaje.style.visibility = 'visible';
mensaje.style.opacity = 1;
setTimeout(function()
{
/* Hacemos desaparecer el mensaje suavemente */
mensaje.style.opacity = 0;
/* Tras los 0.5 segundos de la animación cargamos la web de destino */
setTimeout(function()
{
mensaje.style.visibility = 'hidden';
window.location = lista_usuarios.php;
}, 500);
}, 5000);
}
</script>
</body>
</html>
I recommend you to display that pop-up message within the page itself. Everything will be simpler and visually more attractive.
Edition (after knowing the complete code)
I have used
Event.preventDefault()
to prevent the button from fulfilling its purpose (submit the form) when we press it, but we do it at the end of the animation withHTMLFormElement.submit()
:Finally, to tell you that this is not the most elegant way to do it. The best, visually speaking, would be to do it via XHR and have the table row disappear without the page having to reload.
Also, your PHP code suffers from the serious security issues associated with SQL injection .
A quick fix could be using
mysqli_real_escape_string()
the following way:And later on:
Comments:
window.open
I suggest the use ofwindow.location.replace
within which we will indicate the route we want to reach but within the same tabdocument.write
when the intention is only to display a text, perhaps in a specific section of the page ( it would be more functional to do it that way ).focus()
, that is, if the intention is to show a warning and then redirect, then it's all about looking to give focus to some element of the web pageCode: