Показать / скрыть раскрывающееся меню на основе предыдущего выбора - PullRequest
0 голосов
/ 29 мая 2020

Я хотел бы показать дополнительное раскрывающееся меню на основе выбора пользователя. В моем случае, если пользователь выбирает взносы, появится дополнительное раскрывающееся меню, оно будет скрыто, если пользователь изменит свой выбор.

Это то, что я пробовал

            <select name='installments' required class="form-control my-2" onclick="choose()">
                <option value="" disabled selected hidden>How would you like to pay?</option>
                {% for value, name in form.fields.installments.choices %}
                    <option value="{{value}}">{{name}}</option>
                {% endfor %}
            </select>
            <!-- if installments -->
            <select name='installnum' class="form-control my-2" style="display:none">
                <option value="" disabled selected hidden>How many months would you like to pay this over?</option>
                {% for value, name in form.fields.installmnum.choices %}
                    <option value="{{value}}">{{name}}</option>
                {% endfor %}
            </select>

Это это javascript, который я написал

<script>
    function choose() {
        if (document.getElementById('installments').value == 'installments') {
            document.getElementById('installnum').style.display == 'block';
                } else {
                    document.getElementById('installnum').style.display = 'none';
                }
            }
</script>

Идея должна состоять в том, что если вы выберете рассрочку, появится раскрывающееся меню installnum

Это мой forms.py со списком опций для каждое выпадающее меню

installment_choices = (
    ('upfront', 'Upfront'),
    ('installments', 'Installments'),
)
installnum_choices = (
    ('2', '2 months'),
    ('3', '3 months'),
    ('4', '4 months'),
    ('5', '5 months'),
    ('6', '6 months'),
    ('7', '7 months'),
    ('8', '8 months'),
    ('9', '9 months'),
    ('10', '10 months'),
)

1 Ответ

0 голосов
/ 30 мая 2020

Я не совсем уверен, что это отвечает на вопрос, но похоже, что вы пытаетесь получить доступ к элементу DOM и напрямую прочитать его значение. Я считаю, что вам нужно посмотреть на значение, генерируемое событием.

function choose (event)
{
   event.preventDefault();
   if(event.value === "expected") { // ... then modify the css }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...