[pyar] Django y Upload imagen
Juan Carlos Abdala
tonisgo en gmail.com
Mar Abr 19 15:41:03 ART 2016
Ya te agregue.
Saludos
El 19 de abril de 2016, 15:22, Alessandro Odetti<aodetti en gmail.com>
escribió:
> 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 -*
>
> _______________________________________________
> 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
>
--
Att. Juan Carlos Abdala
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL: <http://listas.python.org.ar/pipermail/pyar/attachments/20160419/e0bcb40d/attachment.html>
Más información sobre la lista de distribución pyar