Html фильтр выпадающего списка тем
Я работаю над проектом школьной LMS на python django и столкнулся с проблемой в html выпадающем фильтре. Есть 3 поля. имя учителя, список предметов, и флажок классов. Если я выбираю 1 класс, то в выпадающем списке предметов должен отображаться только соответствующий предмет, но в списке предметов отображаются все предметы из базы данных. Я приложу код и требуемый вывод для справки.
</head>
<body>
<script>
function showSuccessPopup() {
alert("Successfully Submitted");
}
</script>
<h2 style="text-align: center;">Assign Subjects and Classes to Teachers</h2><br>
<div class="container">
<div class="card">
<form method="post" onsubmit="showSuccessPopup()">
{% csrf_token %}
<div class="form-group">
<label for="teacher">Teacher:</label>
<select name="teacher" id="teacher" class="form-control">
<option>----Select Teacher----</option>
{% for teacher in teachers %}
<option value="{{ teacher.id }}">{{ teacher.first_name }} {{ teacher.last_name }}</option>
{% endfor %}
</select>
</div><br>
<div class="form-group">
<label for="subject">Subject:</label>
<select name="subject" id="subject" class="form-control">
<option>----Select Subject-----</option>
{% for subject in subjects %}
<option value="{{ subject.id }}">{{ subject.name }}</option>
{% endfor %}
</select>
</div><br>
<div class="form-group">
<label for="classes">Classes:</label>
{% for cls in classes %}
<div class="form-check">
<input type="checkbox" name="classes" value="{{ cls.id }}" class="form-check-input">
<label class="form-check-label">{{ cls.classes }}</label>
</div>
{% endfor %}
</div>
<button type="submit" class="btn btn-primary">Assign</button>
</form>
</div>
</div>
</body>[dropdown subject](https://i.sstatic.net/Tgkf4GJj.jpg)
ожидаемый вывод в выпадающем списке тем