1 respuesta en este tema

[squall2501]

Estimados

Tengo el siguiente problema estoy realizando una aplicación donde la persona debe subir una foto.Esta debe subirse al servidor y a la carpeta correspondiente después de cargarla en el input file y mostrar la foto en un cuadro

Todo ocurre sin problemas copia el archivo a la carpeta,lo sube a la base de datos,pero al cargarlo la imagen en el div no me muestra nada

He realizado la mayoría

php

//Despues que cambie el estado del input con load se resive la informacion
//cargandola en el divfoto_b_1
 
<script type="text/javascript">
    $(document).ready(function(){
        
        
        $("#fileUpload").change(function(){
   
        $("#foto_b_1").load("../002001/002001007.php");
   });
    });
 
</script>
 
 
//El formulario donde se inserta la foto con una funcion onchange para
//que cuando cambie de estado lo envie con submit
 
 <form method="post" enctype="multipart/form-data"
    action="../002001/002001007.php" target="iframeUpload">
    <input class="adj_foto" name="fileUpload" id="fileUpload" type="file" onchange="javascript: submit()" />
    [br /]<iframe name="iframeUpload" style="display:none"></iframe>
    </form>
 
 
//El div donde se cargara la foto
<div class="foto_b_1" id="foto_b_1"></div>
     
     
  </div>
 
//finalmente el php donde es enviada la informacion de file
 
<?php
require_once('../001001/001001002.php');
$tra=new Trabajo();
$foto=$tra->get_fotos();
 
 
$tipo = substr($_FILES['fileUpload']['type'], 0, 5);
$nombre=$_FILES['fileUpload']['name'];
$tam = $_FILES['fileUpload']['size'];
 
 
$dir = '../003001/fotos/';
 
 
if (!copy($_FILES['fileUpload']['tmp_name'], $dir.$_FILES['fileUpload']['name']))
echo '<script> alert("Error al Subir el Archivo");</script>';
else
echo '<script> alert("El archivo '.$_FILES['fileUpload']['name'].' se ha copiado con Exito");</script>';
$tra->up_foto($nombre,$tam);
 
 
//Aqui tengo el problema lo raro que al usar un alert para ver 
//el contenido d ela variable me muestra el nombre de la foto sin problemas
 
echo  '<img src="../003001/fotos/'.$nombre.'" />';
 
?>

Gracias de antemano

[squall2501]

Ok me contesto solo jejeje


A través de un plugin de jquery se puede fácilmente mostrar la imagen que subimos al servidor usando con ajax  sin tener que enviar el file con un boton submit simplemente al añadir el archivo se hara todo el proceso y por otra parte podemos con unas cuentas lineas php subirla al servidor y a su carpeta correspondiente( obviamente con lso permisos de lectura y escritura) y usando un flash para mostrar el proceso de subida

Necesitamos

- jquery.uploadify.v2.1.0.min.js
- jquery-1.4.3.min
- Y el swf para mostrar la carga

php

//el input para subir la imagen o archivo
  <input id="upload_button1" type="file" name="upload_button1"/>

php

<script type="text/javascript">
 
//la funcion javascript
 
 $(document).ready(function() {
	$('#upload_button1').uploadify({ //el id del div
		'uploader'  : 'js/uploadify.swf',//el archivo swf
		'script'    : '../002001/002001007.php',//la pagina php que procesara la informacion
		'cancelImg' : 'cancel.png', 
		'auto'      : true, 
		'folder'    : '../003001/fotos/', //la carpeta de las imagenes
		'scriptData' : {'texto': $("#mitexto").val()}, //el texto que se mostrara mientras se sube 
		'onComplete': function(event, queueID, fileObj, response, data) {  //la respuesta despues que se ejecute
 		    $('#foto_b_1').append(response); //en mi caso al div foto_b_1 agregare la info devuelta
		}
	});
 
</script>

php

//el div donde se insetara la foto despues de la respuesta
    <div class="foto_b_1" id="foto_b_1"></div>

php

//la pagina php que procesara el archivo
//lo subira a la carpeta y al servidor
 
 
<?php
 
 
abstract class Con{
 
	public static function conectar()
	{
 
	$co=mysql_connect("localhost","root","password");
	mysql_select_db("tubd");
	return $co;
	}
 
 
}
 
class Trabajo{
 
 public function up_foto($nombre,$tam){
            
        //aqui tambien recogo el tamaaño del archivo por que me lo exigen noe s necesario
 
        $sql= "INSERT INTO arcphoto  VALUES(null,1,1,now(),'".$nombre."',1,1,'".$tam."')";
        mysql_query($sql,Con::conectar());
 
	}
 
 
}
 
 
/*
 
Obviamente todo lo anterior puede ir en otro archivo y llamarlo con un require_once
*/
 
$tra=new Trabajo();
 
 
 
if (!empty($_FILES)) {
	$tempFile = $_FILES['Filedata']['tmp_name'];
	$file_name = $_FILES['Filedata']['name'];
        $tam = $_FILES['Filedata']['size'];
	$targetPath = $_SERVER['DOCUMENT_ROOT'] . $_REQUEST['folder'] . '/';
	$targetFile =  str_replace('//','/',$targetPath) . $file_name;	
	if (move_uploaded_file($tempFile,$targetFile)){
            
                $tra->up_foto($file_name,$tam);
		echo "<img src='../003001/fotos/".$file_name."'/>";
	} else {
		echo 'Tu archivo falló';
	}
}
?>

Pagina con el ejemplo y el codigo  de descarga

http://www.miguelman...os-usando-ajax/