PHP: Palautelomake
Otavan Opiston Av-wiki
Tämä jakso käsittelee sitä kuinka lomakkeen kautta voidaan välittää tieto sähköpostiin. Aika usein on on kyse palautelomakkeista.
Sisällysluettelo |
[muokkaa] Lomake
<form id="form" name="form" method="post" action=" "> Nimi:<br /> <input type="text" name="nimi" id="nimi" /> <br /> Sähköposti:<br /> <input type="text" name="sposti" id="sposti" /> <br /> Viesti:<br /> <textarea name="viesti" id="viesti" cols="45" rows="5"></textarea> <br /> <input type="submit" name="laheta" id="laheta" value="Lähetä palaute" /> </form>
No mitä uutta tuossa? Lähinnä se on tuo pätkä koodia name="nimi" id="nimi" eli XHTML:ää varten on id, mutta ennen oli aina name. Nyt sitten varmuuden vuoksi molemmat.
[muokkaa] LABEL FOR (etiketit)
Lisätään lomakkeen esteettömyyttä ja käytettävyyttä etikettien avulla. Kyse on tästä koodista: <label for="nimi">Nimi:</label>
<form id="form" name="form" method="post" action=" "> <label for="nimi">Nimi:</label><br /> <input type="text" name="nimi" id="nimi" /> <br /> <label for="sposti">Sähköposti:</label><br /> <input type="text" name="sposti" id="sposti" /> <br /> <label for="viesti">Viesti:</label><br /> <textarea name="viesti" id="viesti" cols="45" rows="5"></textarea> <br /> <input type="submit" name="laheta" id="laheta" value="Lähetä palaute" /> </form>
Nyt tarvitsee klikata vain etikettiä eli esim tekstiä Sähköposti niin kursori on valmiina oikeassa paikassa.
[muokkaa] LEGEND ja FIELDSET
Laittamalla mukaan Legendin ja Fieldsetin parannat esteettömyyttä ja samalla vaikutat ulkoasuun.
<form id="form" name="form" method="post" action=" "> <fieldset style="width: 400px;"> <legend>PALAUTELOMAKE</legend> <label for="nimi">Nimi:</label><br /> <input type="text" name="nimi" id="nimi" /> <br /> <label for="sposti">Sähköposti:</label><br /> <input type="text" name="sposti" id="sposti" /> <br /> <label for="viesti">Viesti:</label><br /> <textarea name="viesti" id="viesti" cols="45" rows="5"></textarea> <br /> <input type="submit" name="laheta" id="laheta" value="Lähetä palaute" /> </fieldset> </form>
[muokkaa] wrap="virtual"
Yllä oleva koodi takaa sen, että painettaessa Enteriä vaihtuu rivi. Mutta jos teksti törmää seinämään siirtyy se seuraavalle riville, mutta teksti ei katkea fyysisesti. Kyseinen kenttä on tietysti textarea.
<form id="form" name="form" method="post" action=" "> <fieldset style="width: 400px;"> <legend>PALAUTELOMAKE</legend> <label for="nimi">Nimi:</label><br /> <input type="text" name="nimi" id="nimi" /> <br /> <label for="sposti">Sähköposti:</label><br /> <input type="text" name="sposti" id="sposti" /> <br /> <label for="viesti">Viesti:</label><br /> <textarea name="viesti" id="viesti" cols="45" rows="5" wrap="virtual"></textarea> <br /> <input type="submit" name="laheta" id="laheta" value="Lähetä palaute" /> </fieldset> </form>
[muokkaa] tabindex
Tabulaattori on näppärä ja sen saa toimimaan myös webissä. Käsky on tabindex. Laitetaan toimimaan niin, että ensin on nimi ja sitten viesti ja vasta viimeisenä s-posti.
<form id="form" name="form" method="post" action="palaute.php"> <fieldset style="width: 400px;"> <legend>PALAUTELOMAKE</legend> <label for="nimi">Nimi:</label><br /> <input type="text" name="nimi" id="nimi" tabindex="1"/> <br /> <label for="sposti">Sähköposti:</label><br /> <input type="text" name="sposti" id="sposti" tabindex="3" /> <br /> <label for="viesti">Viesti:</label><br /> <textarea name="viesti" id="viesti" tabindex="2" cols="45" rows="5" wrap="virtual"> </textarea> <br /> <input type="submit" name="laheta" id="laheta" value="Lähetä palaute" /> </fieldset> </form>
[muokkaa] Lomakkeen käsittelijä
Lomake voi olla HTML-muodossa, mutta lomakkeen käsittelijä on aina php-muodossa. Seuraavaksi teemme lomakkeenkäsittelijän, joka käsittelee tiedot ja lähettää ne s-postiin. Lomakkeenkäsittelijän nimi on tietysti palaute.php (ks yllä kohta action).
<?php
$to = "jari.sarja@internetix.fi";
$from = $_POST["sposti"];
$subject = "Palaute";
$name = $_POST["nimi"];
$message = $_POST["viesti"];
if (mail($to, $subject, $message ,"From: $name <$from>"))
echo nl2br("<h2>Palaute on lähetetty!</h2>");
else
echo "Viestin lähettäminen epäonnistui";
?>
Lomake näyttää nyt tältä:
Ja kun tiedot lähettää on lopputulos tämä:
Ja tältä se näyttää spostissa
Kokeile sitä tuolla: http://www.avkymppi.net/palaute/palaute.htm
[muokkaa] Tarkista lomakkeen tiedot
Listään lomakkeeseen tarkistus, että kaikki kentät on täytetty.
<?php
// muuttuja, joka kerää virheet talteen
$errors = array();
// Tarkista nimi
if (!$_POST["nimi"])
$errors[] = "- nimesi";
// Tarkista sähköposti
if (!$_POST["sposti"])
$errors[] = "- sähköposti";
// Tarkista viesti
if (!$_POST["viesti"])
$errors[] = "- viesti";
// Jos virheitä niin näytä
if (count($errors)>0){
echo "<strong>Seuraavat tiedot ovat pakollisia</strong><br />";
foreach($errors as $virhe)
echo "$virhe
";
echo "
Täydennä lomake <br />";
echo "<a href='javascript:history.go(-1)'>palaa lomakkeeseen</a>";
}
else {
// lomake on täytetty oikein
$to = "jari.sarja@internetix.fi";
$from = $_POST["sposti"];
$subject = "Palaute";
$name = $_POST["nimi"];
$message = $_POST["viesti"];
if (mail($to, $subject, $message ,"From: $name <$from>"))
echo nl2br("<h2>Palaute on lähetetty!</h2>");
else
echo "Viestin lähettäminen epäonnistui";
}
?>
[muokkaa] Tarkistetaan lähettävä lomake
Jos spam on ongelmana voit laittaa tarkistuksen sille, että posti lähetetään lomakkeeltasi.
//Tarkistaa lähteekö tiedot oikealta lomakkeelta if ($_SERVER['HTTP_REFERER']!= "http://www.avkymppi.net/palaute/palaute.htm") $errors[] = "- Lomakkeenkäsittelyn käyttö estetty!";
Kokonaisuus näin
<?php // muuttuja, joka kerää virheet talteen $errors = array(); //Tarkistaa lähteekö tiedot oikealta lomakkeelta if ($_SERVER['HTTP_REFERER']!= "http://www.avkymppi.net/palaute/palaute.htm") $errors[] = "- Lomakkeenkäsittelyn käyttö estetty!"; // Tarkista nimi if (!$_POST["nimi"]) $errors[] = "- nimesi"; // Tarkista sähköposti if (!$_POST["sposti"]) $errors[] = "- sähköposti"; // Tarkista viesti if (!$_POST["viesti"]) $errors[] = "- viesti"; // Jos virheitä niin näytä if (count($errors)>0){ echo "<strong>Seuraavat tiedot ovat pakollisia</strong><br />"; foreach($errors as $virhe) echo "$virhe
"; echo "
Täydennä lomake <br />"; echo "<a href='javascript:history.go(-1)'>palaa lomakkeeseen</a>"; } else { // lomake on täytetty oikein $to = "jari.sarja@internetix.fi"; $from = $_POST["sposti"]; $subject = "Palaute"; $name = $_POST["nimi"]; $message = $_POST["viesti"]; if (mail($to, $subject, $message ,"From: $name <$from>")) echo nl2br("<h2>Palaute on lähetetty!</h2>"); else echo "Viestin lähettäminen epäonnistui"; } ?>
Kokeile esim lähettää tietoja väärältä lomakkeelta: http://www.avkymppi.net/palaute/palaute2.htm
Luokat: PHP | PHP-kurssi
