Question

我有一个带有return this.get('store').query('event', { sort : 'starts-at', filter : filterOptions });的Django表单，并且在模板中渲染了这样的字段：

ImageField

生成的HTML看起来像这样：

{{ form.my_image_field }}

我只想渲染Currently: <a href="https://....s3.amazonaws.com/....jpg">....jpg</a> <input name="my_image_field-clear" id="my_image_field-clear_id" type="checkbox"> <label for="my_image_field-clear_id">Clear</label><br> Change: <input name="my_image_field" id="id_my_image_field" type="file">元素，因为我正在使用bootstra-fileinput库：https://www.npmjs.com/package/bootstrap-fileinput：

<input

是否可以执行此操作而无需在模板中手动编写<input name="my_image_field" id="id_my_image_field" type="file">标签？

Answer 1

通常，ImageField个使用ClearableFileInput小部件。默认情况下，此小部件使用模板名称django/forms/widgets/clearable_file_input.html.

您可以使用不同的模板制作自己的ClearableFileInput小部件子类。

from django.forms.widgets import ClearableFileInput

class MyImageWidget(ClearableFileInput):
    template_name = "myapp/my_template.html"

该模板的内容可能只是默认模板的<input>部分，其中删除了多余的标签和复选框。您可以根据需要自定义它。看起来像

<!-- myapp/my_template.html -->
<input type="{{ widget.type }}" name="{{ widget.name }}"{% include "django/forms/widgets/attrs.html" %}>

然后在您的表单中为ImageField指定窗口小部件

class MyForm(forms.Form):
    #  ...
    my_image_field = forms.ImageField(widget=MyImageWidget)
    #  ...

Django还提供了一个FileInput小部件，该小部件使用了plain template。如果适合您的需求，只需

class MyForm(forms.Form):
    #  ...
    my_image_field = forms.ImageField(widget=forms.widgets.FileInput)

或者，您可以通过在项目的django/forms/widgets/clearable_file_input.html目录中创建template文件来覆盖默认模板。但是，这会将更改应用到使用ClearableFileInput小部件的所有字段的呈现中，因此这种方法不那么灵活。

Django ImageField-仅渲染<input />元素

1 个答案: