PHP Formulär
Varför formulär?
Jo, vi ska se grunderna i hur man skickar data mellan webbsidor med hjälp av formulär.
Nu så, nu har du, förhoppningsvis, kunskapen att hantera variabler, du vet vad arrays och funktioner är. Du vet hur du utför en jämförelse mellan t.ex. två variabler. Men att skapa en sida med PHP är ofta lite poänglöst om du inte kan ta emot data från dina besökare. Detta är det sista som är finessen.
För att en besökare ska kunna interagera med din sida måste han/hon ha någon metod att skicka data på, t.ex. via ett HTML-form.
Två enkla exempel - POST och GET
Här följer ett exempel på två sidor, den ena skickar data till den andra. Vi använder oss av ett enkelt textfält.
Först visar jag en sida som skickar data:
<form method="post" action="mottagare.php">
<input type="text" name="skickat">
<input type="submit" value="Skicka">
</form>
Som ni ser behövs ingen PHP för att skicka data.
Här följer php-kod för filen mottagare.php för att kunna
spara det som skickats i variabler.
<?php
$mottaget = $_POST["skickat"];
echo $mottaget;
?>
Arrayen $_POST är en s.k reserverad array, en array som alltid finns där
redo, även om du inte har deklarerat den själv.
Du känner nu igen ett namngivet fält i en array när du ser det,
här hämtade vi datan som fanns i fältet "skickat",
och sparar i variabeln $mottaget. Hade fältet vi skickade från hetat
t.ex. "data" hade det som skickats återfunnits i $_POST["data"]
POST är det vanligaste och säkraste sättet att skicka data på,
ett enklare sätt att skicka data på men som inte är lika säkert
är genom metoden GET.
GET kan användas för att skicka data via länkar, en länk
som ser ut som såhär skickar GET-data;
Du hämtar datan på samma sätt som post, fast med den fördefinerade arrayen $_GET.
<?php
$mottaget = $_GET["namn"];
echo "Du heter ".$mottaget;
?>
Du har även en tredje enkel metod att bolla data mellan sidor med, cookies/sessioner.
När du behärskar PHP lite bättre kan du utforska detta själv
med hjälp av boken och nätet. Vi lämnar därför cookies/sessioner
så länge.
Första exemplet i en och samma fil
<?php
if (isset($_POST["skickat"]) && $_POST["skickat"]!="") {
$mottaget = $_POST["skickat"];
echo "Du skickade ".$mottaget;
}
?>
<form method="post" action="">
<input type="text" name="skickat">
<input type="submit" value="Skicka">
</form>
Vi testar först om den superglobala POST-variabeln "skickat" finns. Med finns menas att den har ett värde som inte är null. För oss räcker det att om den har ett värde så får vi svaret true. Det är vårt första krav. Skulle vi nöja oss med den så kan man fortfarande "bara" klicka på submit-knappen och skicka en tom textsträng(det vill säga vi har inte skrivit något i textrutan innan vi klickar på knappen). Det är ju ingen vits att visa något om inget finns att visa så vi säkrar upp mot detta också genom att lägga till att följande villkor även det ska vara uppfyllt, $_POST["skickat"]!="" .
För att komma tillbaks till samma sida så kan vi ju skriva hela sökvägen till filen vi befinner oss i, men om vi byter namn eller flyttar filen till en ny mapp så fungerar det inte längre. Om vi efter "action" lämnar en tom sträng så tolkas detta som att den ska skickas till servern för att hämta samma sida som vi befinner oss på.
Säkra skickad information från XSS (Cross Site Scripting)
<?php
if (isset($_POST["skickat"]) && $_POST["skickat"]!="") {
$mottaget = htmlspecialchars($_POST["skickat"]);
echo "Du skickade ".$mottaget;
}
?>
<form method="post" action="">
<input type="text" name="skickat">
<input type="submit" value="Skicka">
</form>
Du kan till exempel skriva följande kod i formulärets textruta, "<script>alert('hacked')</script>" som då skickas iväg och kommer skrivas ut i body-elementet på sidan. Webbsidan skickas till webbläsaren och körs. Då kommer javascript-koden att köras och i det här fallet dyker en alert-ruta upp. Ganska harmlöst men vi hade lika gärna kunna skickats iväg till en ny sajt som lurat oss.
Vi säkrar informationen genom att göra om <, >, & och andra specialtecken till entiteter genom följande funktion htmlspecialchars( ) .
$mottaget = htmlspecialchars($_POST["skickat"]);
Texten som skrivs ut på webbsidan blir då istället vanliga tecken,
"Du skickade <script>alert('hacked')</script>" .
Jämför att skriva in "<script>alert('hacked')</script>" i detta exempel och även i exemplet ovanför som inte säkrar informationen.
Skicka array
<?php
if (isset($_POST["skickafarg"])) {
if ( isset($_POST["farger"]) ) {
$meddelande = "<p><strong>Du gillar färgerna ";
$minArray = $_POST["farger"];
foreach ($minArray as $value) {
$meddelande .= $value." ";
}
$meddelande .= "</strong></p>";
}
echo $meddelande;
}
?>
<form method="post" action="">
Mina favoritfärger<br>
<select name="farger[]" size="5" multiple="multiple">
<option value="Röd">Röd</option>
<option value="Svart">Svart</option>
<option value="Orange">Orange</option>
<option value="Grön">Grön</option>
<option value="Gul">Gul</option>
</select><br>
<br>
<input type="submit" name="skickafarg" value="Skicka"><br>
</form>
Vi testar att skicka en array.
Vi ser också att [ ] i select-taggen skapar en array och att vi enklast plockar ut befintliga värden med foreach i php-delen.
Här checkar vi om vi tryckt på knappen "Skicka"(den har ett name-attribut och ett value-attribut).
Test: Skicka data som en array från flera textrutor!
Gissa tal?
Exempel, med post, get och med hidden-komponent.
Allt i en och samma php-sida.
Vi tittar på ett exempel där både sändar och mottagar sida är samma webbsida, som visar olika innehåll beroende på om något har skickats och vad som skickats.
Ett program, som utnyttjar $_POST, för att gissa ett tal
<html>
<head>
<title></title>
</head>
<body>
<?php
if (isset($_POST["skickat"]) && $_POST["skickat"] !="") {
$mottaget = $_POST["skickat"];
echo "<p>Du gissade: ".$mottaget."</p>";
if ( $mottaget == 4 ) echo "<p>RÄTT!</p>";
else echo "<p>Tyvärr fel, testa igen!</p>";
} else {
echo "<p>Inget finns att ta emot!</p>";
}
?>
<form method="post" action="">
<!--
som webbsida skulle man kunnat skriva filnamnet också,
men inte lika flexibelt ifall man ändrar filnamnet
-->
<input type="text" name="skickat">
<input type="submit" value="Skicka">
</form>
</body>
</html>
Motsvarande program när vi utnyttjar $_GET
<html>
<head>
<title></title>
</head>
<body>
<?php
if (isset($_GET["skickat"]) && $_GET["skickat"] !="") {
$mottaget = $_GET["skickat"];
echo "<p>Du gissade: ".$mottaget."</p>";
if ( $mottaget == 4 ) echo "<p>RÄTT!</p>";
else echo "<p>Tyvärr fel, testa igen!</p>";
} else {
echo "<p>Inget finns att ta emot!</p>";
}
?>
<form method="get" action="">
<input type="text" name="skickat">
<input type="submit" value="Skicka">
</form>
</body>
</html>
I "action"-attributet i "form"-elementet kan vi lämna tomt för att komma till samma sida. Det finns även andra sätt. Här visas ett annat som ni kanske träffar på då ni surfar på Internet. Vi lägger till den aktuella sökvägen med filnamn till filen vi befinner oss i med hjälp av en inbyggd egenskap i PHP, i action-egenskapen skriver vi <?php echo $_SERVER["PHP_SELF"]; ?>. Vi startar php och skriver ut värdet i $_SERVER["PHP_SELF"] (adressen till sidan vi befinner oss i) och sen stänger vi av php igen och fortsätter med vanlig html kod. Att använda $_SERVER["PHP_SELF"]; är ett äldre sätt att lägga till samma sida, jag nämner det här för att det förekommer relativt ofta i olika forum ute på Internet. Nu använder vi bara tim textsträng, action="".
Till slut så visas ett sätt att skicka med info mellan sidor som inte syns. Vi utnyttjar formulärkomponenten "hidden" (testkör här).
<body>
<?php
if (isset($_POST["skickat"]) && $_POST["skickat"] !="") {
$mottaget = $_POST["skickat"];
$gissningar = $_POST["gissningar"];
$gissningar++;
echo "<p>Du gissade: ".$mottaget."</p>";
if ( $mottaget == 4 ) {
echo "<p>RÄTT! Du fixade det på $gissningar försök.</p>";
} else {
echo "<p>Tyvärr fel, testa igen! Du har testat $gissningar gånger.</p>";
}
} else {
echo "<p>Välkommen!</p>";
$gissningar=0;
}
?>
<form method="post" action="">
<input type="hidden" name="gissningar" value="<?php echo $gissningar; ?>">
Gissa ett tal (0-10)?<br />
<input type="text" name="skickat">
<input type="submit" value="Skicka">
</form>
</body>
</html>