jonasundderwolf / django-image-cropping

Django helper application to easily and non-destructively crop arbitrarily large images in admin and frontend.
Other
553 stars 130 forks source link

Cropping field not rendered in custom forms (in ModelForm is ok) #165

Open pvaling opened 3 years ago

pvaling commented 3 years ago

Hi, all.

I'am trying to use image-cropping in custom Django form and no luck yet (cropping field filtered somewhere and missing in result form). If i making the same in ModelForm way everything is ok, but in my case i cannot use ModelForm because my Form is a mixin of two models with custom submit logic (avatars in User model, but other business fields in Tutor model linked with User. I want to edit avatar field value in Tutor edit form).

My form class:

class TutorProfileForm(forms.Form):

    first_name = forms.CharField(label='First name', max_length=100, disabled=True, required=False)
    last_name = forms.CharField(label='Last name', max_length=100, disabled=True, required=False)

    avatar = ImageField()
    cropping = ImageRatioField('avatar', size='123x345')

    about = forms.CharField(label='About', widget=forms.Textarea)

    is_available = forms.BooleanField(required=False)
    is_approved = forms.BooleanField(required=False, disabled=True)

    experience_years = forms.IntegerField()
    price = MoneyField(default_currency='EUR')

My view:

def tutor_profile(request):

    if request.method == 'GET':
        form = TutorProfileForm(initial={
                'first_name': request.user.first_name,
                'last_name': request.user.last_name,
                'avatar': request.user.avatar,
                'cropping': request.user.cropping,
                'about': request.user.tutor.about,
                'price': request.user.tutor.price,
                'is_available': request.user.tutor.is_available,
                'is_approved': request.user.tutor.is_approved,
                'experience_years': request.user.tutor.experience_years,
        })

    if request.method == 'POST':
        # blabla

    context = {
        'form': form
    }

    return render(request, 'tutors/tutor_profile.html', context=context)

My template:

{% extends 'tutors/base.html' %}

{% load crispy_forms_tags %}
{% load static %}
{% load cropping %}

{% block head_mixin %}
    {{ form.media }}
{% endblock %}

{% block body %}

    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <h1>Tutor profile</h1>
            </div>
        </div>
        <div class="row mt-10">
            <div class="col-md-12">
                <form action="{% url 'tutors:tutor_profile' %}" method="post" enctype="multipart/form-data">
                    {% csrf_token %}
                    {{ form|crispy }}
                    <input type="submit" class="btn btn-success" value="Save">
                </form>
            </div>
        </div>
    </div>

{% endblock %}

Thanks in advance.

MRigal commented 3 years ago

Hi @pvaling ,

Thanks for the detailed report and sorry for the late reply. Could you get somehow forward? We don't use it in custom forms so we didn't thought about it. If you have the opportunity, feel free to submit a PR with a failing test (and with the fix if you found one).

Best, Matthieu