73 lines
2.1 KiB
HTML
73 lines
2.1 KiB
HTML
{% extends 'base.html' %}
|
|
{% block title %}{{ thema.titel }}{% endblock %}
|
|
{% block content %}
|
|
<section class="card">
|
|
<h1>{{ thema.titel }}</h1>
|
|
<p>{{ thema.infotext }}</p>
|
|
<p class="muted">{{ thema.zusatztext }}</p>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<form method="post" id="topic-form">
|
|
<input type="hidden" name="assessment_id" value="{{ assessment_id }}">
|
|
<input type="hidden" name="branche_id" value="{{ branche_id }}">
|
|
|
|
{% for frage in fragen %}
|
|
<div class="question-box">
|
|
<p><strong>{{ frage.text }}</strong></p>
|
|
<div class="radio-row">
|
|
<label>
|
|
<input type="radio" name="frage_{{ frage.id }}" value="ja">
|
|
Ja
|
|
</label>
|
|
<label>
|
|
<input type="radio" name="frage_{{ frage.id }}" value="nein">
|
|
Nein
|
|
</label>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
|
|
<div class="form-actions">
|
|
<button type="submit" class="btn" id="next-button" disabled>Weiter</button>
|
|
</div>
|
|
</form>
|
|
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function () {
|
|
const form = document.getElementById("topic-form");
|
|
const nextButton = document.getElementById("next-button");
|
|
const questionNames = [
|
|
{% for frage in fragen %}
|
|
"frage_{{ frage.id }}"{% if not loop.last %},{% endif %}
|
|
{% endfor %}
|
|
];
|
|
|
|
function updateButtonState() {
|
|
const allAnswered = questionNames.every((name) => {
|
|
return form.querySelector(`input[name="${name}"]:checked`) !== null;
|
|
});
|
|
|
|
nextButton.disabled = !allAnswered;
|
|
}
|
|
|
|
form.addEventListener("change", updateButtonState);
|
|
updateButtonState();
|
|
});
|
|
</script>
|
|
</section>
|
|
|
|
<section class="card" style="display:none">
|
|
<h2>Ansprechpartner</h2>
|
|
{% for person in ansprechpartner %}
|
|
<div class="contact-box">
|
|
<strong>{{ person.name }}</strong>
|
|
<div>{{ person.email }}</div>
|
|
<p>{{ person.infotext }}</p>
|
|
</div>
|
|
{% else %}
|
|
<p>Aktuell keine Ansprechpartner hinterlegt.</p>
|
|
{% endfor %}
|
|
</section>
|
|
{% endblock %}
|