Problema subir imagen con formularios

[shinrak]

Mi problema es un poco raro, pero os lo explico ...

Tengo un formulario donde la gente se registra, ha de completar varios campos como su nombre, descripcion, tlf.. etc.. y dentro de este formulario he puesto un input type file para crear imágenes:

<p>Imagen principal<br /><input type='file' name='file' id='img1' /></p>

Y tengo un archivo .php que me sube las imágenes al servidor, pero para llamar ese archivo tengo que hacerlo por un formulario tipo POST... el caso es que si le diera a enviar el formulario entero a ese archivo para subirme la imagen me tendría que cargar toda la página de nuevo y yo lo que quiero es, que cuando subo una imagen, a través de jquery o como sea cargue el archivo upload.php (que me subirá la imágen) sin alterar el formulario donde me encuentro.

Alguna idea? he probado con..

$("#prueba").click(function(evento){
var nombre = $("#img1").val();
alert('hola');
$("#abc").load("ajax/upload.php", {file: nombre}, function(){
alert('se ha subido la foto');
});

});

Pero eso no me envía parámetros POST si no GET y no me funciona.

[ocp001a]

Un archivo no se puede enviar sin recargar la página, tampoco con ajax.
La forma en que se resuelve es colocar un iframe que suba los archivos y mediante javascript te devuelva éxito o fallo a la página principal (padre)

[shinrak]

Y eso como se haría? incluir el iframe dentro del formulario que cargue la página upload?

[ocp001a]

Si, pondrías un iframe en la página cuyo target sería un formulario con un campo tipo archivo que envíe los datos a algún lugar que procese la subida, una vez hecho, debe dirigir a una página (que puede ser el mismo formulario) que al iniciarse llame a una función js de la página padre para actualizar el estado. Si buscar upload ajax encontrarás algunos ejemplos.

[shinrak]

Sinceramente lo he intentado y no me funciona, pongo de target un iframe pero me carga la otra página :D... luego si puedo os mostrare todo el código...