将图像渲染到 Django 管理中的 choice/char 字段

Question

我的模型中有这样一个 CharField：

simbol_oznaka = models.CharField(choices=CHOICES_SIMBOLI, null=True, blank=True, verbose_name="Simbol", max_length=512)

使用这样的选择元组：

CHOICES_SIMBOLI=( ('', 'No Image'), ('media/simboli/2.png', 'Image 1'),).

我想知道如何在 django admin change/add 表单中呈现图像，因为我不希望用户看到“图像 1”文本，而是图像本身。

这是目前的样子：

用例：我希望用户能够从下拉菜单中显示的几张图片中选择一张（不一定要下拉）

Answer 1

如果你真的想要 select 菜单中的图像，这有点棘手，因为 <option> 不能在其中包含 <img>，我建议你看看这个问题来确定您想要采用哪种类型的解决方案：How to add images in select list?

由于听起来好像您不一定想要下拉列表并且只有几张图片，您或许可以改用单选组。

您可以使用 Django 执行此操作的一种方法是子class RadioSelect 小部件并覆盖 option_template_name class 变量，如下所示：

from django import forms

class SimbolRadioSelect(forms.RadioSelect):
    option_template_name = 'myapp/forms/widgets/simbol_radio_option.html'

然后您需要创建在 option_template_name class 变量中指定的模板：

{% load static %}
<label{% if widget.attrs.id %} for="{{ widget.attrs.id }}"{% endif %}>
    <input type="{{ widget.type }}"
           name="{{ widget.name }}"
           value="{{ widget.value|stringformat:'s' }}"
           {% include "django/forms/widgets/attrs.html" %}>
    {% if widget.value %}
        <img src="{% get_media_prefix %}{{ widget.value|stringformat:'s' }}">
    {% else %}
        {{ widget.label }}
    {% endif %}
</label>

我想出了这个模板主要是通过查看 radio_option.html 和 django 源代码中的其他模板：https://github.com/django/django/tree/main/django/forms/templates/django/forms/widgets

然后你会想要在你的表单中使用它（或者如果你还没有的话创建一个）：

from django import forms

class SimbolAdminForm(forms.ModelForm):
    class Meta:
        fields = '__all__'
        widgets = {
            'simbol_oznaka': SimbolRadioSelect,
        }

然后您可以在您的管理员中使用表格 class:

from django.contrib import admin

class SimbolAdmin(admin.ModelAdmin):
    form = SimbolAdminForm

admin.site.register(Simbol, SimbolAdmin)

然后你将在管理中得到这个：

将图像渲染到 Django 管理中的 choice/char 字段

Render image to a choice/char field in Django admin

django

django-templates

django-models

django-forms

django-admin