1

我有一个 Django 表单,其中有一个ImageField,我在我的模板中呈现这样的字段:

{{ form.my_image_field }}

生成的 HTML 如下所示:

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">

我只想渲染<input元素,因为我使用的是 bootstra-fileinput 库:https ://www.npmjs.com/package/bootstrap-fileinput:

<input name="my_image_field" id="id_my_image_field" type="file">

<input>是否可以在不手动在模板中编写标签的情况下做到这一点?

4

1 回答 1

7

通常,ImageFields 使用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使用普通模板的小部件。如果这适合您的需求,只需执行

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

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

于 2018-06-24T07:47:01.080 回答