Foros del Web - Ver Mensaje Individual

javiercitox · #3 (**permalink**) 13/01/2011, 16:37

lo que hago yo es bastante simple, 1ro me fijo donde quiero que aparesca la imagen de cargando, entonces todo el contenido del formulario lo coloco dentro de un div y le asigno un id a ese div. ejemplo: <div id="contenido">Aquí todo el contenido que se procesa</div>

a continuación de ese div agrego otro div, pero que no sea visible
ejemplo: <div id="cargando" style="display:none;">Aquí pongo la imagen o el texto que quiero mostrar mientras se carga</div>

cuando presiono el boton enviar, al evento onclick le asignas la función para enviar el formulario, pero antes les cambio las propiedades display a los div desde una funcion

ej:

function envio(){setTimeout("subiendo()", 1);}

function subiendo() {
document.getElementById("contenido").style.display = "none";
document.getElementById("cargando").style.display = "inherit";
document.forms[0].submit();
}

resumiendo (copia y pega para que veas http://htmledit.squarefree.com/):

Código HTML:

Ver original<head>
<script>
function envio(){setTimeout("enviar()", 1);}
 function enviar() {            
                document.getElementById("contenido").style.display = "none";
                document.getElementById("cargando").style.display = "inherit";
 
                document.forms[0].submit();
            } 
</script>
</head>
<body>
<FORM ACTION="paginaquerecibedatos.php" METHOD="POST">
<div id="contenido">Aquí todo el contenido que se procesa...
<button name="boton_1" type="button" onclick="envio()">enviar!</button>
 
</div>
 
<div id="cargando" style="display:none;">Aquí pongo la imagen o el texto que quiero mostrar mientras se carga</div>
</FORM>
</body>