关于django模板中表单字段值的动态隐藏/取消隐藏选项卡

我有一个模板，在标签中呈现三个表单。

第三种forms是隐藏的，如果选择第二种forms的字段中的值（通过下拉选择），我想动态输入。

当我在第二个表单上选择选项b-option时，我想取消隐藏第三个选项卡。

有任何想法吗？

input.html（模板）

 {% csrf_token %} 
 
 
 Demographics 
 
 Diagnosis 
 
 A_b_sickle 
 
 
 
 
 {%crispy frm%}
 
 
 
{%crispy frm_d%}
 
 
 
 {%crispy frm_a_b_s%}
 
 
 
  

views.py

 def input(request): context = RequestContext(request) if request.method == 'POST': my_demographics = DemographicForm(request.POST, prefix="demo") my_diagnosis = DiagnosisForm(request.POST, prefix='diag') my_a_b_sickle= A_b_sickle_thalForm(request.POST,prefix='a_b_s') if my_demographics.is_valid() and my_diagnosis.is_valid() and my_a_b_sickle.is_valid: my_demographics_object = my_demographics.save() my_diagnosis_object = my_diagnosis.save(commit=False) my_diagnosis_object.patient = my_demographics_object my_diagnosis_object.save() my_a_b_sickle_object = my_a_b_sickle.save(commit=False) my_a_b_sickle_object.patient = my_demographics_object my_a_b_sickle_object.save() else: my_demographics = DemographicForm(prefix='demo') my_diagnosis = DiagnosisForm(prefix='diag') my_a_b_sickle= A_b_sickle_thalForm(prefix='a_b_s') return render_to_response('input.html', {'frm':my_demographics, 'frm_d': my_diagnosis, 'frm_a_b_s': my_a_b_sickle}, context) 

models.py

 class Diagnosis(models.Model): patient = models.ForeignKey(Demographic) age_of_diagnosis = models.IntegerField(null=True,blank=True) diagnosis_option_value = ( ('a-option', 'a-option'), ('b-option', 'b-option'), ) diagnosis_option = models.CharField( max_length=45,choices=diagnosis_option_value, default=diagnosis_option_value[0][0]) def __str__(self): return str(self.patient) 

编辑：渲染后的模板代码

 
 Diagnosis option*
a-optionb-optionselect> 

编辑：我的解决方案

   $(document).ready(function() { $('#id_diag-diagnosis_option').change(function () { var value = $(this).val() if (value === 'b-option'){ $('#mytab a[href="#3"]').parent().removeClass("hide"); } }); });  

Answer 1

你需要在Javascript / jQuery中做到这一点：

 // For each check box bind $("#id_diag-diagnosis_option").change(function(){ // Get the value of the option var value = $(this).val() // Check the value if (value === "b-option"){ // Show the tab $('#myTab a').tab('show'); } }) 

不要忘记使用正确的myTab a更改tab_id并使用正确的API调用来显示选项卡！