PHP-Code in affenschwanz/03_step/exercise_unchecked.php
<?php
/* NOTCH START */
// Checke, ob der Submit-Button geklickt wurde
if (isset($_POST['go'])) {
// Ja, wir sind im zweiten oder x-ten Affenschwanz-Durchgang
$feedback = "<div class=\"feedback_positive\">";
$feedback .= "Das Formular wurde verschickt. Folgende POST-Variablen sind angekommen:<br><br>";
// Füge den Inhalt des $_POST-Arrays dem Feedback-String hinzu
foreach($_POST as $key => $value){
$feedback .= "Name: <em>".$key."</em>, Wert: <strong>".$value."</strong><br>";
}
$feedback .= "</div>\n";
}
else {
// Nein, wir sind im ersten Affenschwanz-Durchgang
// Das heisst, das Formular wurde frisch geladen und es wurden noch keine User-Eingaben gemacht.
$feedback = "<div class=\"feedback_negative\">";
$feedback .= "Das Formular wurde noch nicht verschickt. Klicke den Submit-Button!";
$feedback .= "</div>\n";
}
/* NOTCH END */
?>
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Übung 1</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto+Condensed&family=Roboto:ital,wght@0,400;0,500;1,400&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/css/styles.css">
<link rel="stylesheet" href="/css/formstyles.css">
</head>
<body>
<div id="container">
<h1>Übung 1</h1>
<p><img src="../images/chuck_norris.gif" style="widtth: 100%; max-width: 300px; height: auto;"></p>
<ul>
<li>In diesem Formular hat es Checkboxen, Radiobuttons und eine Auswahlliste (<code><select></code>).</li>
<li>Wenn man das Formular verschickt, gehen die gewählten Optionen verloren. Dies soll verhindert werden.</li>
<li>Das "Repopulation" dieser Elemente ist ungleich viel schwieriger als z. B. mit <code><input type="text"></code> zu programmieren. Du brauchst die Attribute <code>selected</code> und <code>checked</code>, welche du mit PHP im zweiten @-Durchgang hinzufügen musst.<br>
Das <code>value</code>-Attribut nützt dir hier übrigens nichts.</li>
<li>Die Radio-Buttons ("Ja/Nein") sollen obligatorisch sein. Programmiere das Feedback so, das darauf hingewiesen wird, falls keine Option gewählt wurde.</li>
</ul>
<?=$feedback?>
<form action="" method="post">
<div class="form_control">
<input type="checkbox" id="surfen" name="surfen" value="Surfen">
<label for="surfen" class="no_block label_right">Surfen</label>
<br>
<input type="checkbox" id="rudern" name="rudern" value="Rudern">
<label for="rudern" class="no_block label_right">Rudern</label>
<br>
<input type="checkbox" id="segeln" name="segeln" value="Segeln">
<label for="segeln" class="no_block label_right">Segeln</label>
</div>
<div class="form_control">
<input type="radio" id="yes" name="answer" value="Ja">
<label for="yes" class="no_block label_right">Ja</label>
<br>
<input type="radio" id="no" name="answer" value="Nein">
<label for="no" class="no_block label_right">Nein</label>
</div>
<div class="form_control">
<label for="land">Land</label>
<select name="land" id="land">
<option value="noop">Bitte wählen</option>
<option value="ch">Schweiz</option>
<option value="de">Deutschland</option>
<option value="li">Liechtenstein</option>
</select>
</div>
<div class="form_control">
<!-- Auch das wird veschickt -->
<button type="submit" name="go" class="btn btn-blue">Verschicken</button>
</div>
</form>
</div>
</body>
</html>