E42-105 Határidő: http://ffacsko.emk.nyme.hu/index.php?id=10664 szerint
2. feladat
Helló Világ! Témakörök A gyakorlaton megtanulja, 1. hogyan kell PHP parancsokat ágyazni egy HTML kódot tartalmazó fájlba; 2. hogyan kell űrlapot készíteni (HTML); 3. hogyan kell táblázatot készíteni (HTML); 4. hogyan kell programelágazást szervezni (PHP);
a.) feladat Készítsen egy PHP-oldalt, amely a böngészőbe a „Helló Világ!” üdvözletet írja! Mivel ez lesz az első php programja, segítségképpen talál működőképes kódokat a 2. és 3. oldalon. ☺ Vizsgálja meg, hogy a böngészőben milyen forráskód jelenik meg! Másolja be mindkét kódot (az Ön által megírt és a böngésző által megjelenítettet) a feladatot készre jelentő e-mailbe! A forráskódhoz 1. ábra: Helló Világ! kapcsolódóan helyezzen el egy, a php-oldalra mutató linket is! Válaszolja meg a következő kérdést: Hasonlítsa össze a két kódot, és magyarázza meg, hogy mit is jelent a „szerver oldali programozás” kifejezés! (A válaszadás megkönnyítésére a megjegyzések között talál segítséget.)
b.) feladat Módosítsa úgy az előző PHP-oldalt, hogy az a napszaknak megfelelően köszönjön! 5:00 – 7:59: Jó reggelt! 8:00 – 18:59: Jó napot! 19:00 – 22:59: Jó estét! 23:00 – 4:59: Helló világ! A működő kód eredményét megtekintheti a http://quercus.emk.nyme.hu/php/Koszonoviszony.php oldalon. Másolja be az e-mailbe az Ön által megírt kódot, és magyarázza el működését! A forráskódhoz kapcsolódóan helyezzen el egy, a php-oldalra mutató linket is!
c.) feladat Módosítsa az előzőekben elkészített HelloVilag.php kódot olymódon, hogy a felhasználó maga állíthassa be a háttér és a betű színét! A színeket egy legördülő listából lehessen kiválogatni. A működő kód eredményét megtekintheti a http://quercus.emk.nyme.hu/php/SzinesHello.php oldalon. Másolja be a forráskódot az e-mailbe, és magyarázza el annak működését! A forráskódhoz kapcsolódóan helyezzen el egy, a php-oldalra mutató linket is! Próbálja ki a 2. ábra: Színes „Helló Világ!” kódot a method=get és a method=post beállításokkal is! Milyen különbséget tapasztal a két metódus működésében? Válaszának helyességét képernyőshotok készítésével, és azoknak az e-mailhez történő csatolásával bizonyítsa!
E42-105
2. feladat
d.) feladat Módosítsa az előző kódot oly módon, hogy ne fordulhasson elő az azonos háttér- és betűszín. Ha véletlenül valaki azonos színeket állít be, akkor állítódjon be a fekete háttér- és fehér betűszín. A weboldal a hibás beállításról tájékoztassa is a felhasználót. A működő kód eredményét megtekintheti a http://quercus.emk.nyme.hu/php/HelyesSzines.php oldalon. Másolja be az e-mailbe a forráskódot, és magyarázza el működését! A forráskódhoz kapcsolódóan helyezzen el egy, a php-oldalra mutató linket is!
Néhány megjegyzés Figyeljen arra, hogy behúzásokkal tegye áttekinthetővé, könnyen olvashatóvá a phpkódot! Alkalmazza az előző gyakorlaton létrehozott stíluslapot! Mint a kezdő előadások egyikén szó volt róla, a php-állományok végeredményként egy html-kódot generálnak, mégpedig oly módon, hogy egy webszerver és egy phpszerver együttműködik. Ha a html-fájl feldolgozására érkezik kérelem, akkor csak a webszerver dolgozik, de ha php-állomány a feldolgozandó, akkor a kérelmet a webszerver továbbítja a php-szerver fele, majd a php-szerver által generált html-kódot küldi vissza az igénylő böngészőprogramnak (3. ábra).
php
php
web
web
index.html
index.php
3. ábra: Egy html- és egy php-kérelem feldolgozása
Egy php-fájlban vegyesen fordulnak elő html tagek és php utasítások. Nézzük meg az a.) feladat egy lehetséges megoldását: .:: Helló Világ! ::. A php utasításokat a határolójelek között kell elhelyeznünk, olyasféleképpen, mintha
egy páratlan tag volna, melynek paraméterei a php parancsok. Hogy ezek felismerhetőek legyenek, le kell zárnunk őket pontosvesszővel (;). A html (-n kivüli) rész „egyszerűen átfolyik” a php szerveren, nem csinál vele semmit. A php parancsokat viszont a php szerver feldolgoz-
2
E42-105
2. feladat
za, és a print() eljárással átadja a webszervernek. A fenti példában egy karaktersorozatot küldött át. Egy másik lehetséges – némileg megbolondított, de működőképes – megoldás: ”); ”); ?> print(” print(” .:: Helló Világ! ::.”); ”); print(” print(” ”); print(”
?> ”); ?> ”); (” y> ?> Helló”); ”); ?> Világ! print(” ” ”; print(””); ”); print(” ?> A megoldás azt próbálja bemutatni, hogy a taget bármikor megszakíthatjuk (akár egy
html-tagen belül is!), majd újra folytathatjuk. Az echo ugyanazt csinálja, mint a print, csak nem eljárásként, hanem utasításként kell használni. Ez a feladat nem „valódi” PHP alkalmazás. Igazából semmi jelentősége nincs a php-blokknak, a html-tagek között, kiírható lenne az üdvözlet anélkül is. Ami miatt érdekes ez az egyszerű példa, az az, hogy tanulmányozhatjuk, milyen kódsorozat áramlik át az internet „vezetékein”. Tegye föl valamelyik megoldást (talán az -t célszerű ☺) a webre, majd vizsgálja meg, hogy a böngészőben milyen forráskód jelenik meg! Hogy könnyebb legyen válaszolni az a.) feladat kérdésére, készítse el kliens oldali nyelven megírt kódot. Az -es tagjét cserélje le a következő, jawascript nyelven megírt kódrészletre: <script> <script> document.write(’ document.write(’Helló Világ!’ Világ!’); script>
A b.) feladat megoldása már nem lehetséges php-szerver nélkül. A kód nem statikus, a megjelenítendő üzenet a gép állapotának (a rendszeridőnek) függvénye. A PHP-ben rendelkezésre áll getdate() eljárás, ami a rendszerdátumot egy – úgynevezett – asszociatív tömbbe helyezi. A tömb olyan változó, ami nem egy, hanem több adatot tartalmaz, vagyis ugyanazzal a névvel tudunk hivatkozni több adatra. Az egyes értékeket egymással a tömbnévhez illesztett indexszel különböztetjük el egymástól. A normál tömböknél ez az index egy egész szám, az asszociatív tömböknél pedig egy megnevezés. A kiírt üdvözlőszöveg a rendszeridő óra-értékétől függ. Ezt az adatot a következő módon szerezhetjük meg: $datum=getdate(); $ora=$datum[”hours”];
Az első utasítás a rendszer időbélyegzőjét elhelyezi a $datum nevezetű tömbben. A második utasítás az időbélyegző óra-részét kiveszi a $datum-ból és elhelyezi az $ora egyszerű változónkba. Az óra-érték $datum tömbből a hours index adja ki. Mivel rendszerértékről van szó, az indexeket nem választhatjuk meg szabadon, hanem az előre definiáltakat kell használnunk. (Az hours egyébként órát jelent angolul.) A programot több esetre kell felkészítenünk: az óra-érték függvényében JóReggelt-et, JóNapot-ot, JóEstét-et vagy HellóVilág-ot kell „mondania”. Mivel a megkülönböztetendő esetek száma nagyobb, mint kettő, ezért a switch utasítást célszerű használni: switch (változó) {case érték1: [utasítássorozat1] case érték2: [utasítássorozat2] … [default:utasítássorozatd] } A switch kulcsszó mögött kerek zárójelek között meg kell adni annak a változónak a nevét, a-
melynek tartalmától, értékétől tesszük függővé, hogy mit kell csinálnia a gépnek. A switch blokkját kapcsos zárójelek határolják. Az egyes eseteket a case szócska vezeti be, mögötte konstansként meg kell adni egy értéket, majd kettőspontot követően azokat az utasításokat, amelye-
3
E42-105
2. feladat
ket az adott érték esetében végre kell hajtani. Legutolsóként megadható a default sor is: ha egyik felsorolt konstanssal sem egyenlő a változó értéke, akkor az itt megadott utasítások lépnek működésbe. A switch működéséről tudni kell, hogy minden esetben minden case-sorát megvizsgálja. Ha üres utasítássorozatot talál, akkor az utána következő első, utasítássort fogja végrehajtani. Az a.) feladatnál olyan kódot készítettünk, amely mindig ugyanazt a html-kódot állította elő – tulajdonképpen nem is kell hozzá PHP, a b.) feladat megoldása már időben változó – pontosabban időfüggő – webkódot generál, azonban egyik alkalommal sem kellett a felhasználónak működés közben beavatkoznia. Gyakran szükséges, hogy a gépet használó személy által megadott adatoktól (kívánságától) függ a generált weboldal tartalma, formája. A gépet kezelő személytől a szükséges adatokat úgynevezett űrlap (form) használatával lehet megszerezni. Egy űrlap elemeit a
html-tagek közé kell zárni. Az action értékeként megadott fájl fogja kiértékelni a get vagy post metódus szerint továbbított adatokat. Ha nem adunk meg fájlnevet, a fájl önmagát hajtja végre ismételten. A tagek között helyezendők el az űrlap elemei: listák, jelölődobozok, rádiógombok, beviteli mezők, jóváhagyó nyomógomb. Egy weblapon több űrlap is elhelyezhető, de ezek közül mindig csak egy hajtható végre. A felhasználó adtamegadási szabadságát korlátozhatjuk (ezáltal a hibázás esetét kizárhatjuk) abban az esetben, ha előre tudjuk mely értékek lehetséges egy adott helyzetben. Ha ezek mennyisége véges, de sok, akkor célszerű listát szervezni: <select name=”változónév” [size=hossz]>
