Dynamiczny charakter dokumentu HTML z kodem PHP
Wyjaśnijmy na początku, co rozumiemy pod pojęciem dynamiczny. Jest to przeciwieństwo statyczny, a taki właśnie charakter mają strony WWW tworzone tylko w oparciu o HTML. Mówiąc krótko, kod HTML wyświetli zawsze dokładnie to samo. Zastosowanie PHP umożliwia pokazywanie strony rożnie wyglądającej, w zależności od bieżących okoliczności.
Ćwiczenie 1_7_0_1. Pokazywanie aktualnej daty i godziny
Npisz skrypt PHP, który będzie pokazywał aktualną datę i czas.
<body>
<form action="" method="post">
<input type="submit" name="pokaz_date_i_czas" value="Pokaż aktualną datę i czas" />
<?php
$dzis=getdate();//funkcja getdate() daje nam aktualną datę i czas
$dzien=$dzis['mday'];
$miesiac=$dzis['mon'];
$rok=$dzis['year'];
$godz=$dzis['hours'];
$min=$dzis['minutes'];
$sek=$dzis['seconds'];
if (isset($_POST['pokaz_date_i_czas']))
echo 'Dzisiaj jest '. $dzien.'.'.$miesiac.'.'.$rok.' godzina '.$godz.':'.$min.':'.$sek;
/*if (isset($zmienna)) - jeżeli istnieje zmienna
if (isset($_POST['pokaz_date_i_czas'])) - jeżeli wysłano formularz submitem
pokaz_date_i_czas*/
?>
</form>
</body>
Tutaj znajduje się plik z poprawnie napisanym skryptem. Zwróć uwagę, że w tym samym pliku jest umieszczony formularz składający się tylko z submitu
oraz skrypt PHP. Wartość atrybutu action=""
formularza jest pusta, co spowoduje odświeżenie strony. Po każdym kliknięciu Pokaż aktualną datę i czas
zostanie pokazana inna - aktualna wartość.
Ćwiczenie 1_7_0_2. Pokazywanie inaczej wyglądającej strony, w zależności od danych wysłanych przez formularz
Napisz skrypt PHP, który będzie pokazywał zielony kwadrat o boku 300 pikseli, lub kwadrat czerwony o boku 600 pikseli, w zależności od wybranej opcji. To ćwiczenie będzie wymagało utworzenia trzech plików: pliku z formularzem, pliku ze skryptem PHP oraz zewnętrznego arkusza stylów. Jeżeli masz problem z umieszczeniem pól opcji w formularzu to tutaj przypomnisz sobie potrzebne wiadomości. Zwróć uwagę na link do zewnętrznego arkusza stylów. Kody HTML, CSS oraz PHP pokazane są tym razem w całości zawartości pliku.
Kod HTML:
<!doctype html>
<html>
<head>
<title>Testowanie skryptów PHP</title>
<meta charset="UTF-8" />
</head>
<body>
<form action="wyniki.php" method="post">
<fieldset>
<legend>Pokazać stronę z kwadratem zielonym czy czerwonym?</legend>
<p>
<label>
<input type="radio" name="opcja" value="zielony" />
Z zielonym 300 x 300 pikseli
</label>
</p>
<p>
<label>
<input type="radio" name="opcja" value="czerwony" />
Z czewonym 600 x 600 pikseli
</label>
</p>
<p>
<input type="submit" name="pokaz_strone" value="Pokaż stronę" />
</p>
</fieldset>
</form>
</body>
</html>
Kod CSS:
.zielony
{
width:300px;
height:300px;
background-color: green;
}
.czerwony
{
width:600px;
height:600px;
background-color: red;
}
Kod PHP osadzony w HTML:
<!doctype html>
<html>
<head>
<title>Testowanie skryptów PHP</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<?php
//odbieramy dane formularza
if (!isset($_POST['opcja']))//jeżeli nie istnieje zmienna $_POST['opcja'] to...
echo 'Brak zaznaczonej opcji!';
else //w przeciwnym razie wykonaj blok instrukcji
{
$zielony=$_POST['opcja']==='zielony';//$zielony będzie true lub false
if ($zielony) $styl='zielony';//if ($zielony) - jeżeli zielony jest true
else $styl='czerwony';
//generujemy kod HTML
echo '<div class="'.$styl.'">';
echo '</div>';
}
echo "\n"; //wymuszamy nowy wiersz w kodzie HTML
?>
</body>
</html>
Tutaj znajduje się plik z poprawnie napisanym formularzem. Zwróć uwagę, że kod PHP generuje różny kod HTML, w zależności od opcji wybranej przez użytkownika.
Praca domowa
Wyjaśnij w zeszycie, dlaczego strony WWW wykonane podczas zajęć, mają charakter dynamiczny.
Jeżeli zapomniałeś jak przygotować i gdzie zapisywać pliki testowe: