Autor
|
Tema: [AYUDA] Script subir imagenes sin hacer POST, sin que el formulario se recargue (Leído 8,285 veces)
|
|
6666
Desconectado
Mensajes: 146
Wikileaks.org
|
Si por supuesto, esto se hace con javascript, una vez que tienes la imagen cargada en el input de file, lo pasas a base64 y con esa string usas para lo que quieras. test.htm<style> .thumb { height: 75px; border: 1px solid #000; margin: 10px 5px 0 0; }
</style>
<input type="file" id="files" name="files[]" multiple /> <output id="list"></output>
<script> function handleFileSelect(evt) { var files = evt.target.files; // FileList object
// Loop through the FileList and render image files as thumbnails. for (var i = 0, f; f = files[i]; i++) {
// Only process image files. if (!f.type.match('image.*')) { continue; }
var reader = new FileReader();
// Closure to capture the file information. reader.onload = (function(theFile) {
return function(e) { // Render thumbnail. var span = document.createElement('span'); span.innerHTML = ['<img class="thumb" src="', e.target.result, '" title="', escape(theFile.name), '"/><p><textarea>', e.target.result,'<textarea>'].join(''); document.getElementById('list').insertBefore(span, null); }; })(f);
// Read in the image file as a data URL. reader.readAsDataURL(f); } }
document.getElementById('files').addEventListener('change', handleFileSelect, false); </script>
|
|
« Última modificación: 4 Septiembre 2014, 07:33 am por 6666 »
|
En línea
|
|
|
|
Graphixx
Desconectado
Mensajes: 1.336
Full Stack Developer
|
No encontre en internet ni un solo ejemplo de un upload dinamico de fotos en AJAX, asi que dejo el que hice yo... EL QUE YO MISMO DESARROLLE:http://www.4shared.com/rar/RIqTGpcTce/imageupload18.htmlConste habia muchas paginas que decian como subirlas , pero no como modificarlas ni borrarlas, eso fue lo que me toco hacer.
|
|
« Última modificación: 5 Septiembre 2014, 04:05 am por Graphixx »
|
En línea
|
Nada tiene fin solo hay pequeñas pausas, pausas que determinan el comienzo de otros. Graphixx Rōninnovation
|
|
|
JorgeEMX
|
EL QUE YO MISMO DESARROLLE:
Tu actitud es siempre la misma. Propones un tema como desesperado, después de alguna respuestas y de ponerle peros a todo; regresas a presumir lo que seguramente ya tenías hecho. Yo sinceramente tomo eso como spam, por no colocarte una etiqueta más despectiva. En fin., propongo que te creas un tema y vayas colocando todas tus creaciones!
|
|
|
En línea
|
|
|
|
Graphixx
Desconectado
Mensajes: 1.336
Full Stack Developer
|
Tu actitud es siempre la misma. Propones un tema como desesperado, después de alguna respuestas y de ponerle peros a todo; regresas a presumir lo que seguramente ya tenías hecho. Yo sinceramente tomo eso como spam, por no colocarte una etiqueta más despectiva. En fin., propongo que te creas un tema y vayas colocando todas tus creaciones! No es SPAM , ojala fueran mis creaciones, a lo mucho son "adaptaciones", no presumo por que de que voy a presumir, si lo que hice lo hice leyendo tutoriales de internet que crearon verdaderos cracks. Perdona si la forma mia de tratar el tema te incomodo, no era mi intencion trollear por aca, de verdad necesitaba con ancias ese ejemplo y no se si es que estaba buscando por los terminos que no eran pero no logre encontrarlo por ningun lado, habia dos polos opuestos en una cara estaban los ejemplos que solo enseñaban como subir las imagenes mediante ajax y nada mas, sin eliminar.... y en la otra cara estaban los gestores de archivos ya demasiado robustos que se salian de las necesidades basicas que buscaba suplir. Y el ejemplo que puse es el ejemplo sencillo de como SUBIR, ELIMINAR o MODIFICAR una sola imagen por usuario mediante AJAX. Me falta la parte de que si la imagen es demasiado grande el mismo sistema la vuelva thumbnail osea que la reduzca a algo aceptable y elimine la imagen grande y guarde solo la pequeña, esas modificaciones las subo el fin de semana.
|
|
|
En línea
|
Nada tiene fin solo hay pequeñas pausas, pausas que determinan el comienzo de otros. Graphixx Rōninnovation
|
|
|
dantemc
Desconectado
Mensajes: 2.003
:D
|
|
|
|
En línea
|
8-D
|
|
|
#!drvy
|
<?php include("../mysqli.inc.php"); $qr = $_POST['qr']; $nombreImagen = $_POST['imgNombre']; $conexion=mysqli_connect ($cfg_servidor,$cfg_usuario,$cfg_password,$cfg_basephp1); $sentencia="update datos_basicos set foto = '' where qr = '".$qr."'"; echo "<li><img src='imagenes/Sinimagen.jpg' width='180px' height='120px' /></li>"; echo "<li><input type='file' name='btnAgregar' id='btnAgregar' onchange='agregar(btnAgregar);' /></li>"; } $Eliminar = "imagenes/" .$nombreImagen; if($do != true){ echo "Se produjo un error al eliminar la imagen" .$nombreImagen. "<br />"; } ?>
Pfff xD Saludos
|
|
|
En línea
|
|
|
|
Graphixx
Desconectado
Mensajes: 1.336
Full Stack Developer
|
Esa parte no la he incluido en el ejemplo, por lo que se supone que el codigo que estamos trabajando es solo el de subir, modificar y eliminar las imagenes asincronicamente mediante AJAX, ya lo estoy compilando ya que le he agregado la opcion de que si la imagen es demasiado pesada (mas de 1mb) el sistema la redimenciona a 50KB por lo de que la imagen es nada mas un avatar en el sistema, ahorita en 1 hora lo monto todo.
|
|
|
En línea
|
Nada tiene fin solo hay pequeñas pausas, pausas que determinan el comienzo de otros. Graphixx Rōninnovation
|
|
|
|
Mensajes similares |
|
Asunto |
Iniciado por |
Respuestas |
Vistas |
Último mensaje |
|
|
como hacer que un programa se recargue?
.NET (C#, VB.NET, ASP)
|
Frost
|
7
|
4,284
|
7 Junio 2007, 03:10 am
por Frost
|
|
|
Enviar Formulario POST a script
Java
|
cyberserver
|
3
|
4,540
|
19 Febrero 2009, 17:14 pm
por -Ramc-
|
|
|
Algun servicio gratuito de imagenes, que las deje subir desde mi script, API ?
PHP
|
Graphixx
|
3
|
2,162
|
20 Mayo 2012, 21:33 pm
por dimitrix
|
|
|
Ayuda para agregar DOS imagenes a Formulario VB 6.0 enlazado con Access
Programación Visual Basic
|
Ozharu-Ad
|
0
|
1,459
|
22 Noviembre 2015, 22:19 pm
por Ozharu-Ad
|
|
|
¡AYUDA! ¿Script/Programa que autoresponda un test/formulario?
Programación General
|
DaniRSoria
|
3
|
2,527
|
26 Octubre 2016, 22:26 pm
por Poyoncio
|
|