UpdateView and ImageField style

[BikerJim]

Hi,

First post, be gentle :), I cant find a solution here or on StackOverflow, which either means that I am missing something obvious, or the answer is 'you cant', or I am googling for the wrong thing. I am using Django 1.6 on Kubuntu with PIL...

I have a simple UserProfile with an image field (and a Textfield), which uploads the file fine and displays it in the template from MEDIA_URL fine, all working great. I am using the UpdateView generic view to do it and all is dandy, except..

The 'fileupload' form field/widget {{ form.mugshot }} adds some extra HTML to the widget which I would prefer wasn't there:

"Currently: " <a href="path/to/file">path/to/file</a><br/>"Change: "

Is there a way to get rid of that extraneous HTML? It looks ugly and is unnecessary as far as I can see :( but this might not even be Django related.. sorry if I am barking up the wrong tree, but I have lost count of the trees now.. I have found some possible soultions, but some are really complicated and others just dont seem to work for me.

Here is a simplified version of my model and view:

models.py

class UserProfile(models.Model):

    user = models.OneToOneField(User, related_name='profile')

    about_me = models.TextField(max_length="500")

    mugshot = models.ImageField(max_length=1024,storage=OverwriteStorage(), upload_to=image_file_name, default = "images/profiles/anon.user.png")

views.py

class ProfileUpdate(UpdateView):
    model = UserProfile
    fields = ['mugshot', 'about_me']
    template_name_suffix = '_update_form'

Any clues or pointers? Even what to Google for would be good!

Thanks!

Jim

[Jonathan Baker]

Welcome to the mailing list. I've never done this myself, but a bit of Googling leads me to believe that you need to define your own UserProfileEdit form class, instead of letting UpdateView automatically create the form for you. This will allow you to use the FileInput widget and avoid the extraneous text (generated by the default widget for ImageField). Said form could look similar to this:

### forms.py ####

from django import forms

from .models import UserProfile

class UserProfileEditForm(forms.ModelForm):

    mugshot = forms.ImageField(required=False, widget=forms.FileInput)

    class Meta:

        fields = ["mugshot"]  # add other fields here, in the order you want them to be displayed

        model = UserProfile

Then import and reference your new form:

### views.py ###

from .forms import UserProfileEditForm

class ProfileUpdate(UpdateView):

    form_class = UserProfileEditForm

    ...

Reference: http://stackoverflow.com/questions/14336925/how-to-not-render-django-image-field-currently-and-clear-stuff

Hope this helps,

Jonathan

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at http://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/a73810b0-0fc1-4ba2-abb4-3a86d9714153%40googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

--
Jonathan D. Baker
Developer
http://jonathandbaker.com

[BikerJim]

Hi Jonathan,

Thanks a lot for the pointer (it was something obvious!), I now have it working and without the extraneous HTML, and I can now style it to be much prettier, yippee. :)

I had to do one extra little thing to make it work (with my template / model setup), i.e. specify the model in the ProfileUpdate view class as well as the new form.py class, otherwise it raised a 'UserProfile is missing a queryset' error, I also had to specify the template_name_suffix, as I have a slightly non-standard template name (which is probably a silly thing to do which I might fix now!)

views.py

class ProfileUpdate(UpdateView):

    form_class = UserProfileEditForm

    model = UserProfile

    template_name_suffix = '_update_form'

Thanks very much for your warm welcome and the fast and accurate answer!

Cheers
Jim