Изображение не обновляется django

В моем edit.html есть форма, в которой пользователь может редактировать информацию о стажере. Пользователь может добавлять много стажеров, редактировать их, удалять и т.д. Все работает хорошо, кроме изображения. Поле изображения формы появляется в очень беспорядочном состоянии. Также оно не обновляется, когда я выбираю новое изображение. Вот мой код. Я сократил свой код, чтобы сделать его более читабельным

models.py

class Trainee(models.Model):  
TraineePic = models.ImageField(null=True, blank= True, upload_to="traineeImg/")
Name = models.CharField(max_length=50)

class Meta():
    db_table = "Trainee"

forms.py

class TraineeForm(forms.ModelForm):
TraineePic = forms.ImageField(label="Image :", required=False)
Name = forms.CharField(widget=forms.TextInput(attrs={'class':'col-sm-4'}), label='Name :')

class Meta():
    model = Trainee
    fields = ("Name","TraineePic",)

views.py

class UpdateTrainee(UpdateView):
model = Trainee
template_name = 'MyTestApp/edit.html'
form_class = TraineeForm
success_url = reverse_lazy('show')

edit.html

{% extends "MyTestApp/base.html" %}
{% block body_block %}
{% load static %}
    <link rel="stylesheet" href="{% static '/css/bootstrap.min.css'%}" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">

<style>
    ul#id_Gender li{
        display: inline-block;
    }
</style>
<body>
<div class="jumbotron">
    <h2> Edit Trainee </h2>
    <form method="post" class="form-group" type="multipart/form-data" data-ajax="false">
        {%csrf_token%}
        {{form.errors}}

        <div class="form-group row">
            <label class="col-sm-3 col-form-label">{{ form.TraineePic.label }}</label>
            {{form.TraineePic}}

        </div>

        <div class="form-group row">
            <label class="col-sm-3 col-form-label">{{ form.Name.label }}</label>
            {{ form.Name }}

        </div>


       
        <input type="submit" value="Update" class="btn btn-dark">
    </form>
</div>
</body>
{% endblock %}

Вот как выглядит form.TraineePic:
enter image description here

Я также попробовал добавить FileInput следующим образом TraineePic = forms.ImageField(label="Image :", required=False,widget=forms.FileInput). Но потом я не получаю никакого изображения. Любая помощь будет оценена по достоинству.enter image description here

Вы должны использовать #request.FILES, чтобы получить изображение из фронтенда в бэкенд и успешно сохранить его в базе данных.

В views.py

 Example:
 Trainee_Pic= self.request.FILES.get('TraineePic')  # Use request.FILES

Я нашел решение. Похоже, что в моей форме в edit.html была опечатка. Я изменил форму с

на

form method="post" class="form-group" type="multipart/form-data" >

to

form method="post" class="form-group" enctype="multipart/form-data" >

А поле изображения в форме, которое раньше выглядело очень плохо, я поместил в div с style='display: inline-block', и теперь оно выглядит вполне нормально.Present

Вернуться на верх