Show image while processing form

Question

Show image while processing form

Navigation

#1 by (1 votes)

2

Two values are sent from a form:

<form action="accion.php" method="post">
 <p>Su nombre: <input type="text" name="nombre" /></p>
 <p>Su edad: <input type="text" name="edad" /></p>
 <p><input type="submit" /></p>
</form>

In the PHP file several processes are carried out that take a while to process:

$Master = new Maestro();

//----- PROCESOS
$cruzarCodigos = $Master->cruzarCodigos($_POST['nombre'], $_POST['edad']);
$cruzarNombres = $Master->cruzarNombres();
$cruzarFechas  = $Master->cruzarFechas();
$calcularSueldos = $Master->calcularSueldos();
//----- MOSTRAR MENSAJE
$tpl = new Plantilla();
$tpl->assign('mensaje', 'PROCESO TERMINADO');
$tpl->display('procesado.tpl.php');

And in the Smarty template, a message is displayed after the process is finished.

<h5>{$mensaje}</h5>

Since the Submit button is clicked until the $ message is displayed, the screen freezes all the time it takes to process all processes. How can I show an image after clicking Submit and it disappears when I show the message?

jquery php

asked by Piropeator 28.11.2018 в 05:32

source

1 answer

How can I create a method that builds different objects based on a variable? If, else if conditions in java

score 1 · Accepted Answer

  **Con este codigo de css y el script de jquery mostraras un gift de tu elección que represente la carga de la página, el div con la clase loader lo pones debajo de la etique de apertura del body. Espero te sirva**

   <script type="text/javascript"> 
       
        $(window).load(function() {
        $(".loader").fadeOut("slow");
    });
    </script>

<style>
          
    
    .loader {
        position: fixed;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        z-index: 9999;
        background: url('images/uploading.gif') 50% 50% no-repeat rgb(249,249,249);
        opacity: .8;
    }
        </style>

<div class="loader"></div>