Hola muchach@s.
Estoy queriendo hacer un formularion con algunos datos y una imagen que necesito que se guarde en el servidor.
Para guardar la imagen uso PHP y no hay problema , y al querer usar AJAX me encuentro que por algunos motivos no se puede y que se puede simular con un iframe.
Bueno lo pude hacer, pero me falta un detalle, no tengo idea de como hacer que el GIF que aparece cuando se envia el formulario se desaparesca cuando la imagen termine de cargarse en el servidor.
Aca les dejo el código para que lo revisen y agradeceria su ayuda
Código HTML
Código HTML:
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo de subida</title>
<script>
function iniciar(){
document.getElementById('carga').style.visibility = 'visible';
return true;
}
</script>
<style type="text/css">
#carga{
visibility:hidden;
}
</style>
</head>
<body>
<form name="form1" method="post" action="archivos.php" enctype="multipart/form-data" target="la_otra_pagina" onSubmit="iniciar();">
<table width="50%" border="0">
<tr>
<td>Nombre:</td>
<td><input type="text" name="txtNombre" id="textfield"></td>
</tr>
<tr>
<td>Foto:</td>
<td>
<input type="file" name="txtFoto" id="fileField"></td>
</tr>
<tr>
<td> </td>
<td><input type="submit" value="mostrar"></td>
</tr>
</table>
</form>
<iframe name="la_otra_pagina" src="archivos.php" frameborder="0"></iframe>
<div id="carga"><img src="load.gif" width="220" height="19" alt="load"></div>
</body>
</html> Aca el archivos.php
Código PHP:
if($_POST)
{
$nombre = $_POST['txtNombre'];
$nombre_archivo = $_FILES['txtFoto']['name'];
$origen = $_FILES['txtFoto']['tmp_name'];
$destino = "subidas/".$nombre_archivo;
if (move_uploaded_file($origen,$destino))
{
echo $nombre;
echo "<nr/>El archivo ha sido cargado correctamente.";
echo "<br/>".$destino;
}
else
{
echo "Ocurrió algún error al subir el fichero. No pudo guardarse.";
}
}