Why can not I see the sweetalert alert?

2

I have a form in a modal, that when clicking on submit button, after validating the fields, I send it to a php that inserts the data in a database. Next, an alert is notified on the screen.

This is the form

<form action="insertar.php" method="GET" onsubmit="return validaCampos();">                    
                    <div class="form-group">
                        <label for="nombre">Nombre:</label>
                        <input class="form-control" id="nombre" name="nombre" type="text" placeholder="Nombre"></input>
                    </div>
                    <div class="form-group">
                        <label for="edad">Edad:</label>
                        <input class="form-control" id="edad" name="edad" type="text" placeholder="Edad"></input>
                    </div>
                    <div class="form-group">
                        <label for="direccion">Direccion:</label>
                        <input class="form-control" id="direccion" name="direccion" type="text" placeholder="Direccion"></input>
                    </div>

                    <input type="submit" class="btn btn-success" value="Salvar">
               </form>

This is the insert

    <?php


        $mysqli = new mysqli("localhost", "root", "", "bdpersona"); 
        $nom = $_GET['nombre'];
        $edad = $_GET['edad'];
        $dir = $_GET['direccion'];                      
        $sql = $mysqli->query("insert into tbcontactos (nombre, edad, direccion) values ('$nom', $edad, '$dir') ");         

?>  

        <SCRIPT LANGUAGE="javascript"> 
        alert("Contacto Registrado"); 
        </SCRIPT> 
        <META HTTP-EQUIV="Refresh" CONTENT="0; URL=listar.php">

As follows:

In a second plane the list is updated and you do not go to it until you press the accept.

Thanks to your help on alerts: I have removed the alert alert and I have placed a sweetalert with the links for the libraries, but it does not work, it does not run. It's like there's nothing I put a delay before redirecting to the page listar.php and not even that.

Why does not the alert work?

    <?php


        $mysqli = new mysqli("localhost", "root", "", "bdpersona"); 
        $nom = $_GET['nombre'];
        $edad = $_GET['edad'];
        $dir = $_GET['direccion'];                      
        $sql = $mysqli->query("insert into tbcontactos (nombre, edad, direccion) values ('$nom', $edad, '$dir') ");         

?>  

     <link href="https://cdnjs.cloudflare.com/ajax/libs/limonte-
      sweetalert2/7.8.0/sweetalert2.min.css" rel="stylesheet" />
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
   </script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.8.0/sweetalert2.min.js"></script>

        <SCRIPT LANGUAGE="javascript"> 
       swal(
        "Buen trabajo!",
        "El contacto ha sido registrado!",
        "success"
            );
        </SCRIPT> 
        <META HTTP-EQUIV="Refresh" CONTENT="0; URL=listar.php">

Thank you very much for the help

    
asked by Vidal 19.03.2018 в 18:51
source

2 answers

4

In order for the sweetalert to work it has to be inside a javascript function or when starting jquery like in the example that I leave you.

<link href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.8.0/sweetalert2.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.8.0/sweetalert2.min.js"></script>

<script LANGUAGE="javascript">
  $(document).ready(function() {

    swal({
      title: 'Buen trabajo!',
      text: "El contacto ha sido registrado!",
      type: 'success',
      confirmButtonColor: '#3085d6',
      confirmButtonText: 'OK!'
    }).then((result) => {
      if (result.value) {
        window.location.href = "listar.php";
      }
    })

  });
</script>
    
answered by 19.03.2018 / 19:17
source
2

I would do it this way, redirect after the user clicks on the alert button.

I hope you serve

$(document).ready(function(){
swal({
    title: "Buen trabajo!",
    text: "El contacto ha sido registrado!",
    type: "success"
   }).then(function() {
     window.location = "listar.php";
  });
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.8.0/sweetalert2.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.8.0/sweetalert2.min.js"></script>
    
answered by 19.03.2018 в 19:23