[pyar] Django y Upload imagen

[Alessandro Odetti]

Hola Juan,
agregame a hangouts si queres y te tiro unos tips.

Saldos.

El 19 de abril de 2016, 15:20, Juan Carlos Abdala <tonisgo en gmail.com>
escribió:

> Gente estoy con lo siguiente, estoy trabajando con un form que es de alta
> de un usuario y necesito subir una foto.
> La cuestión es que quiero agregar al form vista previa que no tiene con
> widgets de django, así que lo hice con js y html.
>
> Agrego por el formato no necesita que tenga un ajax para mandar las cosas.
>
> En conclusión no se como integrar dentro del html con su respetivo js que
> la imagen la devuelva en el submit del form.
>
>
> Model:
>
> class Teacher(models.Model):
>
>               headline = models.CharField(max_length=200)
>               photo = models.ImageField(null=True, blank=True)
>
>
>  Luego lo agrego a un model form y creo una intancia que envio en la view
> que se llama teachform.
>
> Y lo envió tengo algo así en el tempalte.
>
>
>  <form class="m-t" role="form" action="/newteacher/" method="post">
>             <h3>Completa los Datos de Perfil</h3>
>
>                {% csrf_token %}
>
>                 <div class="col-md-6" align="center">
>                 <p>Imagen de Perfil.</p>
>                     <div class="img-preview img-preview-sm">
>                         <img id="blah" src="/static/img/a2.jpg" alt="your
> image" width="100" height="100" />
>                     </div>
>                  <div class="btn-group">
>                     <label title="Upload image file" for="imgInp"
> class="btn btn-primary">
>                        <input type='file' id="imgInp" class="hide" />
>                     Upload new image
>                     </label>
>                 </div>
>
>                  <div class="form-group">
>                  <p>Una Frase de cabecera.</p>
>                      {{ teachform.headline}}
>                 </div>
>               <button type="submit" class="btn btn-primary block
> full-width m-b">Cargar Perfil</button>
>                 {%if usrform.errors%}
>                     <div class="alert text-center">
>                       <p>{{teachform.errors}}</p>
>                     </div>
>                 {%endif%}
>   </div>
>  </form>
>
> Esto tiene una funcion en Js
>
> <script>
> $(document).ready(function() {
>
>     function readURL(input) {
>
>         if (input.files && input.files[0]) {
>             var reader = new FileReader();
>
>             reader.onload = function(e) {
>                 $('#blah').attr('src', e.target.result);
>             }
>
>             reader.readAsDataURL(input.files[0]);
>         }
>     }
>
>     $("#imgInp").change(function() {
>         readURL(this);
>     });
> });
> </script>
>
>
> Espero que allá logrado explicarme. Desde ya gracias por leerlo.
>
> Saludos
>
>
>
>
> --
> Att. Juan Carlos Abdala
>
>
> _______________________________________________
> pyar mailing list pyar en python.org.ar
> http://listas.python.org.ar/listinfo/pyar
>
> PyAr - Python Argentina - Sitio web: http://www.python.org.ar/
>
> La lista de PyAr esta Hosteada en USLA - Usuarios de Software Libre de
> Argentina - http://www.usla.org.ar
>



-- 
*- Alessandro Odetti -*
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL: <http://listas.python.org.ar/pipermail/pyar/attachments/20160419/99bb013a/attachment-0001.html>