在 Django 中，根据模型中其他字段中选择的值删除选择字段下拉列表中的选项答案

【问题标题】：In Django, remove options in a choice-field dropdown based on the value selected in other field in a model在 Django 中，根据模型中其他字段中选择的值删除选择字段下拉列表中的选项
【发布时间】：2021-12-13 10:27:49
【问题描述】：

我是 Django 新手，感谢任何帮助，如何根据前一个字段限制一个字段中的选择选项。例如，如果我为动物选择“狗”，我想从 FOOD_CHOICE 中删除“巧克力”。谢谢！！！

ANIMAL_CHOICE = (
     ('a','cat'),
     ('b','dog'),
     ('c','fish'),
)
FOOD_CHOICE = (
      ('a', 'chocolate'),
      ('b', 'kittySnack'),
      ('c', 'steak'),
)

class Animal(models.Model):
    animal = models.CharField(max_length=1, choices= ANIMAL_CHOICE)
    food   = models.CharField(max_length=1, choices= FOOD_CHOICE)

【问题讨论】：

这个最好在表格里申请，这个型号请加上你的表格代码

标签： python django django-models dynamic choicefield

【解决方案1】：

As explained here，您应该在模型表单或模型清理方法中进行验证，并在那里提出ValidationError。

这里有一个例子，你可以override the clean method of your model's form:

forms.py

class AnimalForm(ModelForm):
    class Meta:
        model = Animal
        fields = "__all__"

    def clean(self):
        cleaned_data = super(AnimalForm, self).clean()
        animal = self.cleaned_data.get("animal")
        food = self.cleaned_data.get("food")
        if animal == "b" and food == "a": # Might not work, but this is the general idea
            raise forms.ValidationError("Chocolate can't be selected with Dogs")

N.B.：在我评论说它可能不起作用的那一行，你必须调试一下。我不记得（我现在无法测试）cleaned_data 是否返回元组或实际值，或人类可读的值。

现在，我猜您希望 HTML 中的选择能够动态更改。对于前端，您需要做一些 JavaScript。使用 JS 的方法有很多种，这里有一种：

（在您的模板中，<script> 标签之间）

var selectAnimal = document.getElementById("select-animal");
var selectFood = document.getElementById("select-food");

selectAnimal.addEventListener("change", function() {
    if(this.value == "a")
    {
        
        // remove from select the "chocolate" option
        for (var i=0; i<selectFood.length; i++) {
            if (selectFood.options[i].text == 'chocolate')
                selectFood.remove(i);
        }
    }
    else {
        
        // checking if "chocolate" is in select or not
        let has_chocolate = false;
        for (var i=0; i<selectFood.options.length; i++){
            if (selectFood.options[i].text == "chocolate"){
                has_chocolate = true;
            }
        }
        
        if (!has_chocolate){ // if "chocolate" is missing
            option = document.createElement("option");
            option.text = "chocolate";
            option.value = "a";
            selectFood.add(option);
        }
    }
});

【讨论】：