I really want to have a better aspect in the "deivered" page of my form. Is it possible to use "SWEETALERT2"??

This is my form code in html:

<form  id="contact-emotion" method="POST" action="telefono.php">
    <label id="nombre1" for="nombre">Nombre:</label> 
    <input type="text" id="nick" name="nombre1" placeholder="Tu nombre.." required>
    <label id="tel" for="telefono"></label>
    <input type="tel" id="te-llamamos" name="telefono1" placeholder="Déjanos tu teléfono y te llamamos..." onkeypress="return event.charCode>=48 && event.charCode<=57" pattern="(6|7|8|9)[ -]*([0-9][ -]*){8}" required>
    <input type="submit"  value="ok"  id="submit-1" name="enviar1">
</form>

and this is the telefono.php response:

if(isset($_POST['enviar1'])) {
    $destino="[email protected]";
    $nombre1 = filter_var($_POST['nombre1'], FILTER_SANITIZE_STRING);
    $llamame = filter_var($_POST['telefono1'], FILTER_SANITIZE_STRING);
    $fecha_registro = date("Y-m-d");
    $contenido = "Fecha: " . $fecha_registro . "\nNombre: "  . $nombre1 . "\nTelefono-contacto: " . $llamame;

    $mail = mail($destino, "Contacto", $contenido);
    $alerta = "¡GENIAL! ¡Muchas gracias por contactarnos! En breve te llamaremos y aclararemos tus dudas";
    echo 
    "<script>if(confirm('$alerta'));
    window.location = 'https://www.emotion360.es/EmotionWeb/';  
    </script>";

} else {
    echo "<script>alert('No pudimos procesar tu información. Por favor, intenta de nuevo')</script>"; 
}

How could I change to sweetalert? Is it possible? Please I dont want this cold message!!!

Thank you all!

CodePudding user response：

For Sweetalert2 use its library click here to check library

You need first to add this library file before calling sweetalert code

<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

then do this code

if(isset($_POST['enviar1'])) {

    $destino="[email protected]";
    $nombre1 = filter_var($_POST['nombre1'], FILTER_SANITIZE_STRING);
    $llamame = filter_var($_POST['telefono1'], FILTER_SANITIZE_STRING);
    $fecha_registro = date("Y-m-d");
    $contenido = "Fecha: " . $fecha_registro . "\nNombre: "  . $nombre1 . "\nTelefono-contacto: " . $llamame;

    $mail = mail($destino, "Contacto", $contenido);

    $alerta = "¡GENIAL! ¡Muchas gracias por contactarnos! En breve te llamaremos y aclararemos tus dudas";
    echo 
    "<script>
        Swal.fire({
            title: '',
            text: '".$alerta."',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes'
        }).then((result) => {
            if (result.isConfirmed) {
                window.location = 'https://www.emotion360.es/EmotionWeb/';  
            }
        })
      </script>";

} else {
    echo "<script>Swal.fire({icon: 'error',title: '',text: 'No pudimos procesar tu información. Por favor, intenta de nuevo'})</script>"; 
}

CodePudding user response：

For the installation I just have to add:

<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

in telephono.php before open de php tag???

And thats it?

I think my issue is there because the form works correctly without the sweetalert.

Then I change it exactly from yours like:

<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>    

<?php
        if(isset($_POST['enviar1'])) {

    $destino="[email protected]";
    $nombre1 = filter_var($_POST['nombre1'], FILTER_SANITIZE_STRING);
    $llamame = filter_var($_POST['telefono1'], FILTER_SANITIZE_STRING);
    $fecha_registro = date("Y-m-d");
    $contenido = "Fecha: " . $fecha_registro . "\nNombre: "  . $nombre1 . "\nTelefono-contacto: " . $llamame;

    $mail = mail($destino, "Contacto", $contenido);

...

And is giving me the blank "telefono.php" page without the alert!! =(