M03 Hjälp till uppgifter

På denna sidan kommer det finnas hjälp till lösning av uppgifter samt en fullt fungerande lösning i form av kod.

Att kopiera färdiga lösningar gör inte att du blir bättre på programmering, men det kan vara ett effektivt sätt att få lite hjälp för att bli en duktig programmerare. Det är ditt ansvar att använda hjälpen på rätt sätt.

Formulär

Uppgift m03u01

Lösningsförslag [klicka för att visa]

Jag valde att skapa en enda sida som kollar av ifall formuläret är skickat. Om det inte är skickat så ritas formuläret ut, annars skrivs den information ut som användaren matade in i formuläret.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width= , initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>m03u01</title>

    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css">

    <style>
      main{ margin: 20px; width: 60%; max-width: 600px; }
    </style>

  </head>
  <body>
    <main>
      <h1>Lösningsförslag m03u01</h1>
<?php
  // Kolla om formulär har skickats, om det har gjorts så skriv ut info.....
  if(isset($_POST['first_name'])){    // Kolla om $_POST['first_name'] finns
    // Skriv ut alla värden som kan komma med formuläret.
    $output = "<p>Du har angivit följande information i ditt anmälningsformulär.</p>";
    $output .= "<table><tr><td><strong>Namn</strong></td><td>{$_POST['first_name']} {$_POST['surname']}</td></tr>";
    $output .= "<tr><td><strong>Födelsedatum</strong></td><td>{$_POST['birthday']}</td></tr>";
    $output .= "<tr><td><strong>Kön</strong></td><td>{$_POST['gender']}</td></tr>";

    // Denna teknik kallas shorthanded if
    // Exempel. https://davidwalsh.name/php-ternary-examples
    $user_condition = isset($_POST['user_condition']) ? "" : "<strong>INTE</strong>";

    $output .= "<tr><td colspan='2'>Du har {$user_condition} godkänt användarvillkoren.</td></tr>";
    $output .= "</table>";
    $output .= "<a href=''>Gå tillbaka till formuläret</a>";
    echo $output;

  } else {              // ... annars så skrivs formuläret ut
?>
      <form action="?" method="POST">
        <table>
          <tr>
            <td><strong>Förnamn</strong></td>
            <td><input type="text" name="first_name" placeholder="Ange förnamn" required></td>
          </tr>
          <tr>
            <td><strong>Efternamn</strong></td>
            <td><input type="text" name="surname" placeholder="Ange efternamn" required></td>
          </tr>
          <tr>
            <td><strong>Födelsedatum</strong></td>
            <td><input type="date" name="birthday" required></td>
          </tr>
          <tr>
            <td><strong>Kön</strong></td>
            <td>
              <input name="gender" value="woman" id="woman" type="radio" checked> Kvinna<br />
              <input name="gender" value="man" id="man" type="radio"> Man
            </td>
          </tr>
        </table>
        <input type='checkbox' name='user_condition' /> Jag godkänner <a href="">användarvillkoren</a>. <br>
        <input type='submit' value='Skicka' />
      </form>
<?php
  }
?>
    </main>
  </body>
</html>

Utskrift

Formulärsidan

Formulärsidan

Svarssidan

Svarssidan

Sessioner

Uppgift m03u02

Lösningsförslag [klicka för att visa]

<?php
// Sessionen måste starta först i koden.
session_start();

// Kollar om det skickas med en GET['action']-variabel
if(isset($_GET['action'])){
  switch($_GET['action']){      // Switchar på innehållet i $_GET['action']
    case 'create_session':      // Skapar en session
      $_SESSION['name'] = $_POST['username'];
      break;

    case 'kill_session':        // Tar bort sessionen
      session_unset();          // Tömmer sessionen
      session_destroy();        // Tar bort sessionen
      break;
  }
}
?>

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width= , initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>m03u02</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css">
    <style>main{ margin: 20px; width: 60%; max-width: 600px; }</style>
  </head>
  <body>
    <main>
      <h1>Lösningsförslag m03u02</h1>
      <h2>Utskrift av innehåll i sessionen</h2>
      <?php
      if(isset($_SESSION['name'])){     // Om sessionen finns
        echo "<p>Sessionen innehåller : {$_SESSION['name']}</p>";
      } else {
        echo "<p>Sessionen är tom, ingen användare är inloggad.</p>";
      }
      ?>
      <form action="?action=create_session" method="POST">
        <p><label for="username"></label></p>
        <input type="text" name="username" id="username" placeholder="Ange namn" required>
        <input type='submit' value='Lagra användarnamn' />
      </form>
      <a href="?action=kill_session">Döda sessionen</a><br />
      <a href="?">Ladda om sida utan GET-anrop</a>
    </main>
  </body>
</html>

Utskrift

Formulärsidan

Cookies

Uppgift m03u03

Lösningsförslag [klicka för att visa]

<?php
// Sessionen måste starta först i koden.
session_start();
$mess = "";       // Skapar en variabel som har hand om eventuella meddelanden
// Kollar om det skickas med en GET['action']-variabel
if(isset($_GET['action'])){
  switch($_GET['action']){      // Switchar på innehållet i $_GET['action']
    case 'create_session':      // Skapar en session
      $_SESSION['name'] = $_POST['username'];
      setcookie('name', $_POST['username']);  // Skapar en cookie
      $mess = "Om du precis har lagrat ett namn så finns det i SESSIONEN men det kanske inte hann lagras som en COOKIE.<br>Ladda gärna om sidan med länken längst ner.";
      break;

    case 'kill_session':        // Tar bort sessionen
      session_unset();          // Tömmer sessionen
      session_destroy();        // Tar bort sessionen
      $mess = "SESSIONEN är dödad.";
      break;

    case 'kill_cookie':
      setcookie('name', "", time()-3600);   // Cookien gick ut för 1h sedan
      $mess = "COOKIEN är dödad. Kanske visar sidan att den fortfarande finns, ladda då om sidan. Du vet att det tar längre tid att skapa/döda en COOKIE än att hämta den.";
      break;
  }
}
?>

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width= , initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>m03u03</title>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.css">
    <style>
    main{ margin: 20px; width: 60%; max-width: 600px; }
    section{ padding: 20px; border-left: 2px #9B4DCA solid; background-color: #f4f5f6;}
    .mess{color: red;}</style>
  </head>
  <body>
    <main>
      <h1>Lösningsförslag m03u03</h1>
      <section>
        <h2>Utskrift av innehåll i session & cookie</h2>
        <?php
        $output = strlen($mess)==0 ? "" : "<p class='mess'>{$mess}</p>" ;

        if(isset($_SESSION['name'])){     // Om sessionen finns
          $output .= "<p>Sessionen innehåller : {$_SESSION['name']}</p>";
        } else {
          $output .= "<p>Sessionen är tom, ingen användare är inloggad.</p>";
        }

        if(isset($_COOKIE['name'])){
          $output .= "<p>Cookien innehåller : {$_COOKIE['name']}</p>";
        } else {
          $output .= "<p>Cookien är tom, ingen information är lagrad.</p>";
        }

        echo $output;
        ?>
      </section>
      <form action="?action=create_session" method="POST">
        <p><label for="username"></label></p>
        <input type="text" name="username" id="username" placeholder="Ange namn" required>
        <input type='submit' value='Lagra användarnamn' />
      </form>
      <a href="?action=kill_session">Döda sessionen</a><br />
      <a href="?action=kill_cookie">Döda cookie</a><br />
      <a href="?">Ladda om sida utan GET-anrop</a>
    </main>
  </body>
</html>

Utskrift

Formulärsidan