酥脆形式的条件逻辑

时间:2020-03-04 00:16:49

标签: django forms django-crispy-forms

我有一个表单,我想知道我应该如何隐藏字段“ conditionnalWeb”,直到用户为typeOfTheproject字段选择“ Web应用程序”为止? 我已经在网上进行了研究,但我绝对不知道该如何进行……任何帮助都将是一件好事:)

from django import forms
from configurator import models
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Submit, Layout
from .models import TypeOfProgram, Language, Framework, Database
from crispy_forms.bootstrap import (PrependedAppendedText, PrependedText, FormActions)

class ConfiguratorForm(forms.Form):
    helper = FormHelper()
    helper.form_method = 'POST'
    helper.form_show_labels = False

    queryOfProject = TypeOfProgram.objects.values_list('name')
    queryOfFramework = Framework.objects.values_list('name','version')
    queryOfDatabase = Database.objects.values_list('name','version')
    listFramework = []
    listProject = []
    conditionnalWeb=[]
    listFramework=[((q[0],q[1]),q[0]+" version "+q[1])for q in queryOfFramework]
    listProject=[(q[0],q[0])for q in queryOfProject]
    listDatabase = [((q[0],q[1]),q[0]+" version "+q[1])for q in queryOfDatabase]

    typeOfTheproject = forms.ChoiceField(choices = listProject)
    conditionnalWeb = forms.ChoiceField (choices = [('nothing', '----'),("Only Backend","Only Backend"),("Only Frontend","Only Frontend")])
    wantedFramework = forms.MultipleChoiceField(choices = listFramework)
    wantedDatabase = forms.MultipleChoiceField(choices = listDatabase)
    helper.layout = Layout(
        'typeOfTheproject',
        'wantedFramework',
        'wantedDatabase',
        FormActions(Submit('Finalize and find the result','Finalize and find the result', css_class="btn btn-success")) 
    )
#Not Working
    if typeOfTheproject is 'Web application':
        helper.layout.append('conditionnalWeb')

谢谢:)

1 个答案:

答案 0 :(得分:0)

您可以为该任务添加一个简单的javascript:

$(document).ready(function(){
    hideShow()
})

// call hideShow when the user clicks on the project_type dropdownlist
$('#id_typeoftheproject').click(function(){
    hideShow()
});
function hideShow(){
    if(document.getElementById('id_typeoftheproject').value == "7")
    {
        $('#id_conditionnalweb').show();
    }
else 
    {
    $('#id_conditionnalweb').hide();
    }
}

您需要从数据库中查找字段的实际ID,并替换项目的#id_type #id_conditionnalweb 。另外,值'7'需要替换为Web应用程序的ID。