Django编辑表单ImageField无法加载现有值，提交表单无效

问题根源 #

1. FileInput不展示已有图片：默认的FileInput仅提供文件选择框，不会显示已上传的图片；Django为ImageField内置的ClearableFileInput才会自动展示现有图片+清除选项。
2. 编辑场景必填验证冲突：新增时图片是必填项，但编辑时用户可能不想替换图片，原表单会因未上传新图触发必填验证失败。
3. 视图未传入更新实例：POST处理编辑表单时未传入instance参数，导致表单按新增逻辑验证，而非更新逻辑。

具体修复步骤 #

1. 替换Widget为ClearableFileInput

修改forms.py中createNewEdicion的配置，用ClearableFileInput替代FileInput，同时在编辑模式下动态取消图片字段的必填要求：

from django import forms
from .models import Edicion

class createNewEdicion(forms.ModelForm):
    required_css_class = 'required-field'

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        # 已有实例时（编辑模式），取消图片字段必填限制
        if self.instance.pk:
            self.fields['logo'].required = False
            self.fields['banner'].required = False
            self.fields['poster'].required = False

    class Meta:
        model = Edicion
        exclude = ['festival']
        widgets = {
            'logo': forms.ClearableFileInput,
            'banner': forms.ClearableFileInput,
            'poster': forms.ClearableFileInput,
            'fecha_apertura_inscripciones': forms.DateInput(),
            'fecha_cierre_inscripciones': forms.DateInput(),
            'fecha_inicio': forms.DateInput(),
            'fecha_final': forms.DateInput(),
            'fecha_notificacion': forms.DateInput(),
        }
        help_texts = {
            'Nombre': ('Some useful help text.'),
        }
        error_messages = {
            'Nombre': {
                'max_length': ("This writer's name is too long."),
            },
        }

2. 修复视图POST处理逻辑

确保POST请求的表单传入instance参数，让Django按更新逻辑处理，利用表单save()方法自动维护文件：

# views.py中的POST处理部分
if request.method == 'POST':
    # 传入instance指定为更新现有对象
    form_festival = createNewFestival(request.POST, instance=festival)
    form_edicion = createNewEdicion(request.POST, request.FILES, instance=festival.edicion)
    
    if form_festival.is_valid() and form_edicion.is_valid():
        form_festival.save()
        # 自动处理文件：有新上传则替换，无新上传则保留原有图片
        form_edicion.save()

3. 模板添加文件上传编码属性

表单必须包含enctype="multipart/form-data"才能正确上传文件，在模板的form标签中添加：

<form method="post" enctype="multipart/form-data">
    {% csrf_token %}
    <!-- 原有表单内容 -->
    <div class="tab">
        <h2>Información de la edición</h2>
        <div class="grid-form-2">
            <div class="fieldWrapper">
                {{ form_edicion.nombre.errors }}
                {{ form_edicion.nombre.label_tag }}
                {{ form_edicion.nombre }}
            </div>
            <!-- 其他字段渲染 -->
        </div>
    </div>
    <button type="submit">Guardar</button>
</form>

效果说明 #

• 编辑页面会自动显示已上传的图片，用户可选择上传新图替换，或直接提交保留原图片。
• 提交时不会因未上传新图触发必填验证错误，原有图片会被正常保留。
• 文件上传逻辑正常，新图片会自动覆盖原有值。

内容的提问来源于stack exchange，提问作者marccgcom