Django Crispy 表单隐藏以其他字段值为条件的字段答案

【问题标题】：Django Crispy forms hide fields conditional on other field valueDjango Crispy 表单隐藏以其他字段值为条件的字段
【发布时间】：2018-11-29 12:23:40
【问题描述】：

如何根据表单中另一个字段的值隐藏/显示 Django 清晰表单中的表单字段。

例如字段 A 有一个下拉菜单，其中包含“1”和“2”选项当字段 A = '1' 时显示字段 B 当字段 A = '2' 时显示字段 C 所有其他字段都以常规方式显示

我在论坛中尝试了多种查询/javascript 解决方案，但它们似乎不适用于脆皮表单。

Link1、Link2、Link3

也许我误解了这些解决方案，或者它们不适用于 Crispy 表单。

模型.py

class TestCondition(models.Model):
    some_name = models.ForeignKey(key_name, on_delete=models.CASCADE)
    A_type_choices = (
        ('1','1'),
        ('2','2'),
    )
    Field_A = models.CharField(max_length=20,choices= A_type_choices,default='1')
    B_field_choices = (
        ('abc','ABC'),
        ('cba','CBA'),
    )
    Field_B = models.CharField(max_length=20,choices= B_field_choices,default='abc',blank=True,)
    Field_C = models.CharField(max_length=40, blank=True, default='')

views.py

class ViewUpdateTestCondition(LoginRequiredMixin,UpdateView):
    model = TestCondition
    template_name = 'update.html'
    form_class = TestConditionForm

class TestConditionForm(ModelForm):
    class Meta:
        model = TestCondition
        fields = ('some_name','Field_A','Field_B','Field_C')
    def __init__(self, *args, **kwargs):
        super(ModelconfigForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper(form=self)
        self.helper.form_class = 'form-horizontal'
        self.helper.label_class = 'col-lg-2'
        self.helper.field_class = 'col-lg-8'
        self.helper.form_method = 'post' # this line sets your form's method to post

        self.helper.layout = Layout(
            Fieldset(
                'Test Condition',
                Field('some_name', type='hidden'),
                ('Field_A','Field_B','Field_C')),
            FormActions(
                Submit('submit', "Save changes")
            )   
        )

更新.html

{% extends 'base.html' %}
    {% load static %}
    {% block content %}
            <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
         <script src="{% static 'formset/jquery.formset.js' %}"></script>
        <script>
    function Hide() {
        if(document.getElementById('id_Field_A').options[document.getElementById('Field_A').selectedIndex].value == "1") {
             document.getElementById('id_Field_B').style.display = 'none';
             document.getElementById('id_Field_C').style.display = '';
        } else {
             document.getElementById('id_Field_B').style.display = '';
             document.getElementById('id_Field_C').style.display = 'none';
        }
    };  </script>
         {% load crispy_forms_tags %} 
         {% crispy form form.helper%}
{% endblock %}

【问题讨论】：

触发该函数Hide()的代码在哪里？
啊，好点。我使用的是来自stackoverflow.com/questions/15136657/… 的示例，但它有一个 onchange="Hide()" 触发器。我将如何以脆的形式实现这样的触发器？
您可以在模板底部添加一个addEventListener 来定位下拉列表，用于change 事件
感谢 art06！我添加了以下内容，就像一个魅力。
酷！不知道 django 表单字段名称默认作为“id_”传递给模板...这是可覆盖的吗？

标签： javascript django show-hide django-crispy-forms

【解决方案1】：

感谢art06！我添加了以下内容，就像一个魅力。

<script type="text/javascript"> window.addEventListener("load", Hide);</script> <script type="text/javascript"> var el = document.getElementById("div_id_Field_A"); el.addEventListener("click", Hide);</script>

【讨论】：