You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Django中使用TextChoices渲染Select下拉框仅显示默认值问题排查

问题排查与解决方案

1. 先确认TextChoices的定义是否正确

先检查模型代码是否符合标准写法,错误的定义会导致选项集合无法正常生成:

from django.db import models

class Product(models.Model):
    class Size(models.TextChoices):
        SMALL = 'S', 'Small'
        MEDIUM = 'M', 'Medium'
        LARGE = 'L', 'Large'
    
    size = models.CharField(
        max_length=1,
        choices=Size.choices,  # 必须指定为Size.choices,不能写错
        default=Size.LARGE,
    )

重点检查:Size类是否正确继承models.TextChoices、choices参数是否指向Size.choices、每个选项的键值对(存储值/显示值)格式是否正确。

2. 前端模板写法错误(核心问题)

你当前用{% for size in product.size %}遍历的是单个Product实例的size字段值(也就是默认的LARGE对应的存储值,比如'L'),自然只能拿到一个值。正确的做法是遍历完整的选项集合:

方案一:视图传递选项集合到模板

在视图函数中把选项列表传入上下文:

from .models import Product

def product_page(request, pk):
    product = Product.objects.get(pk=pk)
    size_choices = Product.Size.choices  # 获取完整的选项集合
    return render(request, 'product.html', {'product': product, 'size_choices': size_choices})

模板中遍历size_choices:

<select name="size">
    {% for value, label in size_choices %}
        <option value="{{ value }}" {% if product.size == value %}selected{% endif %}>{{ label }}</option>
    {% endfor %}
</select>

方案二:模板直接调用模型的Choices类

如果视图中传递了Product模型到上下文(比如{'Product': Product}),可以直接在模板中使用:

<select name="size">
    {% for value, label in Product.Size.choices %}
        <option value="{{ value }}" {% if product.size == value %}selected{% endif %}>{{ label }}</option>
    {% endfor %}
</select>

3. 视图层上下文缺失检查

如果视图只传递了product实例,没有传递选项集合或模型类,模板无法获取完整的选项列表。确保视图上下文包含size_choices或Product模型。

4. 其他快捷方案(推荐)

如果使用Django表单类(ModelForm),可以直接让框架自动生成下拉框:

# forms.py
from django import forms
from .models import Product

class ProductForm(forms.ModelForm):
    class Meta:
        model = Product
        fields = ['size']

视图中传递表单实例:

def product_edit(request, pk):
    product = Product.objects.get(pk=pk)
    form = ProductForm(instance=product)
    return render(request, 'product_edit.html', {'form': form})

模板中直接渲染字段:

{{ form.size }}

这种方式会自动生成带所有选项的下拉框,且自动选中当前实例的size值。


内容的提问来源于stack exchange,提问作者Alexfb

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.10 23:55:30