Выпадающий список с опцией «Другой», которая отображает текстовое поле

Question

Я пытаюсь написать приложение Django с формой, в которой есть поле "как вы узнали о нас?" который даст раскрывающийся список (рекламный ролик, поисковая система и т. д. c), включая опцию «прочее». После выбора опции «другое» появится поле, и пользователь может ввести уникальный ответ.

Я пытался это сделать, но застрял. Любая помощь будет принята с благодарностью.

models.py

class PersonalInformation(models.Model):
    user = models.OneToOneField(User, on_delete=models.CASCADE)

    HEAR_ABOUT_US = (
        ('option1', 'Option 1'),
        ('option2', 'Option 2'),
        ('other', 'other'),
    )

    hear_about_us = models.CharField('How did you hear about us?', max_length=200, default=None, choices=HEAR_ABOUT_US)

views.py

def personal_information(request):
    if request.method == 'POST':
        form = PersonalInformationForm(request.POST, request.FILES, instance=request.user.personalinformation)
        if form.is_valid():
            if form['hear_about_us'] == 'other':
                form_data = self.get_form_step_data(form)
                form.refer = form_data.get('other', '')
                form.save()
                return redirect('#')
            form.save()
            return redirect('#')

    else:
        form = PersonalInformationForm(instance=request.user.personalinformation)

    context = {
        'form' : form
    }

    return render(request, 'enrolment/personal_information.html', context)

personal_information. html

{% block content %}
<div class="content-section">
    <form method="POST">
        {% csrf_token %}
        <fieldset class="form-group">
            <legend class="border-bottom mb-4">Personal Information</legend>
            {{ form|crispy }}

            <div id='other' class='other'>
                <!-- WANT THE TEXT BOX TO APPEAR HERE / I THINK IT WOULD BE BETTER DONE WITHIN THE FORM AND NOT AS A SEPERATE SECTION UNDER IT -->
            </div>

        </fieldset>
        <div class="form-group">
            <button class="btn btn-outline-info" type="submit">Submit</button>
        </div>
    </form>
</div>

<!-- this script will be moved to the appropriate file -->
<script>jQuery('#id_hear_about_us').on('change', function() {
    if (this.value == 'other' ) {
        jQuery('#other').show();
    }
    else {
        jQuery('#other').hide();
    }
});</script>
{% endblock content %}

forms.py

class PersonalInformationForm(forms.ModelForm):
    class Meta:
        model = PersonalInformation

        # field added to hear_about_us - if user selects 'other'
        other = forms.CharField(required=False, label='other')

        fields = ['hear_about_us']

Большое спасибо.

Answer 1

Я нашел ответ, мне пришлось поместить поле 'other' над классом Meta в forms.py