为什么带有 ImageField 的表单在 DJango 中无效?

Why form with the ImageField is not valid in DJango?

我在 Django 中有一个名为“User”的模型:

class User(models.Model):
    user_id = models.AutoField(auto_created = True, primary_key = True, serialize = False, verbose_name ='ID')
    surname = models.CharField(max_length=100)
    name = models.CharField(max_length=100)
    patronymic = models.CharField(max_length=100)
    email = models.CharField(max_length=100)
    avatar = models.ImageField(upload_to='store/static/store/user_avatars/')

我还将此模型的列包含到我的表单中:

class UserForm(forms.Form):
    surname = forms.CharField(max_length=100)
    name = forms.CharField(max_length=100)
    patronymic = forms.CharField(max_length=100)
    email = forms.CharField(max_length=100)
    password = forms.CharField(max_length=100)
    avatar = forms.ImageField()

获取该数据的视图:

def sign_up(request):
    if request.method == 'GET':
        return render(request, 'store/sign_up.html')
    elif request.method == 'POST':
        form = UserForm(request.POST, request.FILES)

        if form.is_valid():
            user = User(surname=form.cleaned_data['surname'],
                    name=form.cleaned_data['name'],
                    patronymic=form.cleaned_data['patronymic'],
                    email=form.cleaned_data['email'],
                    avatar=form.cleaned_data['avatar'])
            user.save()

            return HttpResponse("Alright, you signed up! " + form.cleaned_data['email'])
        else:
            print(form.as_table())
            return HttpResponse("Data is error!")

最后,这个视图的前面:

        <form method="post">
            {% csrf_token %}
            <div class="user_data">
                <div class="user_data_grid">
                    <input type="text" name="surname" placeholder="Surname" id="surname" style="grid-row: 2 / span 1">
                    <input type="text" name="name" placeholder="Name" id="name" style="grid-row: 3 / span 1">
                    <input type="text" name="patronymic" placeholder="Patronymic" id="patronymic" style="grid-row: 4 / span 1">
                    <input type="email" name="email" placeholder="Enter your mail" id="email" style="grid-row: 5 / span 1">
                    <input type="password" name="password" id="password" placeholder="Enter password" style="grid-row: 6 / span 1">
                    <input type="checkbox" id="checkbox" onclick="seePassword()" style="grid-row: 6 / span 1">
                    <label for="checkbox" style="grid-row: 6 / span 1"></label>
                    <p id="password_prompt" style="grid-row: 7 / span 1">
                        Password must be at least 8 symbols length!
                    </p>
                    <input type="submit" id="submit_personal_data" value="Sign up" style="grid-row: 8 / span 1" disabled>
                </div>
            </div>
            <div class="user_photo">
                <div class="user_photo_grid">
                    <img src="{% static 'store/sign_up/default_avatar.png' %}" style="grid-row: 2 / span 5" id="avatar_image">
                    <input name="avatar" type="file" accept=".jpg, .jpeg, .png" id="submit_photo" onchange="displayIMG(this)">
                    <label for="submit_photo" style="grid-row: 8">Profile photo load</label>
                </div>
            </div>
        </form>

所以,我想问一下。当我不将 ImageField 包含到我的表单和模型中时 - 没有任何错误,数据正确添加到 table 中。但是,当我像上面的示例一样将 ImageField 包含到我的表单和模型中时 - 出现错误 - 我的表单变得无效。我在 table 中获取有关我的表单的信息,这些信息是这样的:

<tr><th><label for="id_surname">Surname:</label></th><td><input type="text" name="surname" value="Surname" maxlength="100" required id="id_surname"></td></tr>
<tr><th><label for="id_name">Name:</label></th><td><input type="text" name="name" value="Name" maxlength="100" required id="id_name"></td></tr>
<tr><th><label for="id_patronymic">Patronymic:</label></th><td><input type="text" name="patronymic" value="Patronymic" maxlength="100" required id="id_patronymic"></td></tr>
<tr><th><label for="id_email">Email:</label></th><td><input type="text" name="email" value="email@email.com" maxlength="100" required id="id_email"></td></tr>
<tr><th><label for="id_password">Password:</label></th><td><input type="text" name="password" value="password" maxlength="100" required id="id_password"></td></tr>
<tr><th><label for="id_avatar">Avatar:</label></th><td><ul class="errorlist"><li>This field is required.</li></ul><input type="file" name="avatar" accept="image/*" required id="id_avatar"

最后一个字符串表示,问题出在 ImageField 中。我认为问题可能出在前面,因为当我在 Django 管理面板中添加有关用户的信息(还有 ImageFielf 数据)时 - 操作成功。 那么,为什么我这里的表格是无效的?

在您的模特表格 头像 字段中,您应该输入:

avatar = forms.ImageField(blank=True)

如果这不起作用,试试这个:

avatar = forms.ImageField(required=False)

试试这样:

    <form method="post">
        {% csrf_token %}
        <div class="user_data">
            <div class="user_data_grid">
                <input type="text" name="surname" placeholder="Surname" id="surname" style="grid-row: 2 / span 1">
                <input type="text" name="name" placeholder="Name" id="name" style="grid-row: 3 / span 1">
                <input type="text" name="patronymic" placeholder="Patronymic" id="patronymic" style="grid-row: 4 / span 1">
                <input type="email" name="email" placeholder="Enter your mail" id="email" style="grid-row: 5 / span 1">
                <input type="password" name="password" id="password" placeholder="Enter password" style="grid-row: 6 / span 1">
                <input type="checkbox" id="checkbox" onclick="seePassword()" style="grid-row: 6 / span 1">
                <label for="checkbox" style="grid-row: 6 / span 1"></label>
                <p id="password_prompt" style="grid-row: 7 / span 1">
                    Password must be at least 8 symbols length!
                </p>
        <div class="user_photo">
            <div class="user_photo_grid">
                <img src="{% static 'store/sign_up/default_avatar.png' %}" style="grid-row: 2 / span 5" id="avatar_image">
                <input name="avatar" type="file" accept=".jpg, .jpeg, .png" id="submit_photo" onchange="displayIMG(this)">
                <label for="submit_photo" style="grid-row: 8">Profile photo load</label>
            </div>
        </div>
         <input type="submit" id="submit_personal_data" value="Sign up" style="grid-row: 8 / span 1" disabled>
            </div>
        </div>
   </form>

您忘记了编码类型。

你的表格应该是这样的:

<form method="post" enctype="multipart/form-data">