Как я могу получить значение select в django html?

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

<form>
    <div class="modal-body">
        
        <div class="mb-3" id="modal-id" style="display: none;">
            <label for="id-field" class="form-label">ID</label>
            <input type="text" id="id-field" class="form-control" placeholder="ID" readonly />
        </div>

        
        
        
        <div class="mb-3">
            <select class="form-select" aria-label="Disabled select example" name="typeselect">
                    
                <option value="1">Type 1</option>
                <option value="2">Type 2</option>
                <option value="3">Type 3 </option>
                <option value="4">Type 4 </option>
                
                
               
            </select>
        </div>
        {% if typeselect.val == "1" %}
            <div class="mb-3 typeforms typeone">
                {{typeoneform}}
            </div>
        {% elif typeselect.val == "2" %}
            <div class="mb-3 typeforms typetwo">
                {{typetwoform}}
            </div>
        {% elif typeselect.val == "3" %}
            <div class="mb-3 typeforms typethree">
                {{typethreeform}}
            </div>
        {% elif typeselect.val == "4" %}
            <div class="mb-3 typeforms typefour">
                {{typefourform}}
            </div>
        {% endif %}
        </div>
        <div class="modal-footer">
        <div class="hstack gap-2 justify-content-end">
            <button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
            <button type="submit" class="btn btn-success" id="add-btn">Add Customer</button>
            <button type="button" class="btn btn-success" id="edit-btn">Update</button>
        </div>
    </div>
</form>

Я хочу отображать в соответствии со значениями опций из форм, которые я отправляю на html-страницу.

  1. Самый простой способ - просто переместить модальный div так, чтобы он находился вне каких-либо элементов со специальным позиционированием. Одним из подходящих мест может быть перед закрывающим тегом body .
  2. В качестве альтернативы вы можете удалить position: CSS свойства у модала и его предков, пока проблема не исчезнет. Это может изменить внешний вид и функционирование страницы, однако.
Вернуться на верх