AYUDA: subir imagenes con preview (PHAP/JS) todo bien pero...
Publicado por jose luis (1 intervención) el 29/01/2014 04:54:46
Tengo 2 archivos: uno con el formulario y un php que procesa los datos del formulario.
El formulario son 3 cargadores de imagenes que muestran una miniatura de 100x100 de la imagen antes de subirla a la BD.
Funciona perfecto el problema es que cada boton de carga se encuentra en un <form> diferente,
por lo tanto queda 1 <form> para cada cargador de imagen y molesta para el submit pq tendria que poner un boton a cada una.
quien me ayuda a ponerlos todos en un solo <form>, el problema lo tengo con JS ya que por PHP intenté de mil maneras y ninguna me dio.
aca dejo los codigos:
archivo con formulario
archivo procesador
en la carpeta "imagenes_temporales" se cargan los preview de las fotos..
AYUDA!!!
El formulario son 3 cargadores de imagenes que muestran una miniatura de 100x100 de la imagen antes de subirla a la BD.
Funciona perfecto el problema es que cada boton de carga se encuentra en un <form> diferente,
por lo tanto queda 1 <form> para cada cargador de imagen y molesta para el submit pq tendria que poner un boton a cada una.
quien me ayuda a ponerlos todos en un solo <form>, el problema lo tengo con JS ya que por PHP intenté de mil maneras y ninguna me dio.
aca dejo los codigos:
archivo con formulario
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<html>
<head>
<script type="text/javascript">
function setpreview(id)
{form=eval("document.form"+id);
form.target='iframe_null';
form.action='uploader.php?id='+id;
form.submit();
}</script>
</head>
<body>
<form name="form1" action="" method="post" enctype="multipart/form-data">
<div>Personalizar tu imagen: </div>
<div><input name="archivo" id="archivo" type="file" size="35" onChange="setpreview(1)"/></div>
<div><img src="" id="picture1" alt="vista previa" height="100" width="100"/> </div>
</form>
<form name="form2" action="" method="post" enctype="multipart/form-data">
<div>Personalizar tu imagen: </div>
<div><input name="archivo" id="archivo" type="file" size="35" onChange="setpreview(2)"/></div>
<div><img src="" id="picture2" alt="vista previa" height="100" width="100"/> </div>
</form>
<form name="form3" action="" method="post" enctype="multipart/form-data">
<div>Personalizar tu imagen: </div>
<div><input name="archivo" id="archivo" type="file" size="35" onChange="setpreview(3)"/></div>
<div><img src="subir/loader.gif" id="picture3" alt="vista previa" height="100" width="100"/> </div>
</form>
<!-- iframe donde envia el formulario --><iframe src="about:blank" name="iframe_null" style="display:none">
</body>
</html>
archivo procesador
1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
$carpeta="imagenes_temporales/";
$name=$carpeta.basename($_FILES['archivo']['name']);
move_uploaded_file($_FILES['archivo']['tmp_name'],$name);
?>
<script type="text/javascript">
// Enviamos el nombre de la imagen al id picture de la pantalla de donde es llamado
parent.document.getElementById('picture<?php echo $_GET["id"];?>').src='<?php echo $name; ?>';
parent.document.getElementById('picture<?php echo $_GET["id"];?>').style.width='<?php echo $infoFile[0];?>px';
parent.document.getElementById('picture<?php echo $_GET["id"];?>').style.height='<?php echo $infoFile[1];?>px';
</script>
en la carpeta "imagenes_temporales" se cargan los preview de las fotos..
AYUDA!!!
Valora esta pregunta
0
