通过带有上传按钮的表单显示来自 ImageField 的图像

Question

我一直在寻找解决方案。我看到了这个解决方案来显示图像，而不仅仅是图像的链接：Display image from ImageField by means of form

但现在我需要添加一个按钮，以便他们可以上传新图片。

有什么解决办法吗？提前致谢！

我在 Forms.PY 上的代码：

class ProfileUpdateForm(forms.ModelForm):
    class Meta:
        model = Profile
        fields = ['profilePicture', 'coverPicture', 'description', 'job','organizationName','birthday', 'phone','country','city','church','education','website','blog','vlog', 'newsletter', 'mailNotification']
        labels = {
            'profilePicture':'<strong>Profile Picture</strong>',
            'coverPicture':'<strong>Cover Picture</strong>',
            'description':'<strong>Describe yourself</strong>', 
            'job':'<strong>Whats your job title/position?</strong>',
            'organizationName':'<strong>Name of the organization you belong</strong>',
            'birthday':'<strong>Birthday</strong> (YYYY-MM-DD)', 
            'phone':'<strong>Phone Number</strong>',
            'country':'<strong>Country</strong>',
            'city':'<strong>City</strong>',
            'church':'<strong>Name of the local church you attend</strong>',
            'education':'<strong>Tell us about your education</strong>',
            'website':'<strong>Website</strong>',
            'blog':'<strong>Blog</strong>',
            'vlog':'<strong>Vlog</strong>',
            'newsletter':'<strong>Suscribe to the Artventist newsletter</strong> (We hardly send one)',
            'mailNotification':'<strong>Would you like to recive email notifications regarding activity related to your account?</strong>'
            }
    mailNotification = forms.ChoiceField(widget=forms.RadioSelect, label='<strong>Would you like to recive email notifications regarding activity related to your account?</strong>', choices=[(1, 'Instant'), (2, 'Daily'), (3, 'Weekly'),(0, 'No')])
    profilePicture = ImageField(widget=PictureWidget, label='<strong>Profile Picture</strong>')

Answer 1

我假设在表格中显示图像可以正常工作。

现在在要添加 img 标记的 html 模板字符串中添加一个表单。

表单（带有 action="update-img"）由隐藏的输入组成，带有旧图像的 id 和一个提交按钮。

Answer 2

最后我解决了这个问题，在 HTML 中逐个字段显示表单，并通过 <img src="url_to_picture"> 调用图像