Django: ¿cómo puedo mostrar una foto guardada en ImageField?

Question

He estado dando vueltas en círculos durante horas con esto.
Tengo un modelo de perfil de usuario con profile_pic ImageField. Guardé la foto del usuario y ahora quiero mostrarla, pero nada funciona. Revisé documentos, SO, google, sin resultado.
Cargué una foto, y puedo ver que la url se guardó en la base de datos. Esto es lo que tengo:

# models.py 
    class UserProfile(models.Model): 
     ... 
     title  = models.CharField() 
     about_me = models.CharField() 
     profile_pic = models.ImageField(upload_to=content_file_name, blank=True) 

# views.py 
    def user_details(request): 
     if request.method == 'POST': 
      form = UserProfileForm(request.POST, request.FILES, instance=request.user.get_profile()) 
      if form.is_valid(): 
       form.save() 
       return HttpResponseRedirect('/') 
     else: 
      form = UserProfileForm(instance=request.user.get_profile()) 
     return render_to_response('user_details.html', 
       {'user': request.user, 'form': form}, 
       context_instance=RequestContext(request)) 

# user_details.html 
    {% for field in form %} 
     {% if field.name != "profile_pic" %} 
     <!-- display regular fields --> 
     {{ field.label_tag }}{{ field }} 
     {% else %} 
     <!-- display the user photo --> 
     <img src="{{ MEDIA_URL }}{{ field.url }}" /> 
     {% endif %} 
    {% endfor %} 

Cuando veo la fuente del HTML representado, todo lo que veo es el MEDIA_URL (es decir, 'los medios de comunicación /'), pero no la URL de la foto. Si reemplazo {{field.url}} con {{field}} obtengo la URL con la etiqueta "Actualmente", una casilla de verificación "Borrar" y una opción para cambiar la imagen. Pero no puedo ver la imagen en sí.
¿Alguien puede sugerir qué estoy haciendo mal?

Answer 1

Lo siento, no presté suficiente atención al contexto de field. El "campo" que obtiene del bucle for es un contenedor especializado que incluye otros datos sobre el campo para la construcción del formulario. No es el campo en el modelo en sí mismo, solo una representación del mismo para los propósitos de la forma.

para obtener el valor actual de profile_pic, es necesario utilizar la instancia del formulario:

<img src="{{ form.instance.profile_pic.url }}" /> 

{{ MEDIA_URL }} es innecesaria cuando se utiliza el atributo url, ya que añade automáticamente MEDIA_URL.

Answer 2

Esto funciona para mí:

{% for field in form %} 
    <p> 
     {{ field.errors }} 
     {{ field.label_tag }} 
     {% if field.field|get_type == "django.forms.fields.ImageField" and field.value %} 
      <br/><img src="{{ field.value.url }}" width="240"></img></br> 
     {% endif %} 
     {{ field }} 
    </p> 
    {% endfor %} 

get_type es un templatetag definido como:

from django import template 

register = template.Library() 

@register.filter 
def get_type(value): 
    t = type(value) 
    return t.__module__ + "." + t.__name__