JSP segédlet - MintaZH megoldás

A feladatok megoldásához az Oracle JDeveloper 10g használata, illetve ismerete javasolt!

Hozzunk létre egy új alkalmazást: File > New…

Válasszuk az Generic Application lehetőséget, majd a következő ablakban adjuk meg az alkalmazás nevét, illetve a mentési útvonalat! A következő ablakban egyelőre csak egy projektet tudunk hozzáadni, ez legyen most 1_feladat.
Célszerű most hozzáadni a többi projektet is, itt majd ugyanazt az ablakot látjátok, mint az első két esetben. A másik két projekt neve 2_feladat és 3_feladat legyen!

(Ha az Application Navigator-t nem látod, a View > Application Navigator menüpontban be tudod kapcsolni!)
1_feladat
Az Overview ablakban adjunk hozzá egy JSP oldalt.

(Itt bárki kénye kedve szerint „bedobálhatja” az elemeket Designerből, de inkább azt javaslom, hogy a Source nézetben dolgozzatok, így nem kell ide-oda kattintgatni!)
Amit most látunk, az egy statikus HTML oldal, ettől csak egyetlen sor különbözteti meg, mégpedig a !DOCTYPE után levő
<%@ page contentType="text/html;charset=windows-1250"%>
sor. Ez alá másoljuk be a következő sort
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
mellyel a Core TagLibrary használatát engedélyezzük az oldalon. Ezután észrevehetjük, hogy a kódszerkesztő bal margóján egy piros felkiáltójel jelenik meg, erre rákattintva az Install JSP Taglibrary után felugró ablakban a JSTL Core 1.2-t választva a JDeveloper automatikusan csatolja az egész alkalmazáshoz a library-t. Immár nekikezdhetünk a tényleges feladatmegoldásnak!
Mivel a JSP-ben nincs IF-ELSE támogatás, a „k” paraméter vizsgálatát a következőképpen kell elvégezni
<c:choose> <c:when test="${!empty param.k}"> </c:when> <c:otherwise> Adj meg k paraméternek értéket! </c:otherwise> </c:choose>
A következő EL kifejezés alapján döntjük el, hogy „k”-nak van, vagy nincs értéke, és ennek alapján írjuk meg a <c:choose> igaz illetve hamis ágát:
${!empty param.k}
Az igaz ágban lévő kód logikája a következő: szükségünk lesz „k” értékének megfelelő számú oszlopra és sorra, szükségünk lesz két ciklusra; egyre, melyben megadjuk az oszlopok számát, és mégegyre, melyben a sorok számát. A színezést egyelőre hagyjuk ki!
… <c:when test="${!empty param.k}"> <table> <c:forEach var="i" begin="1" end="${param.k}" step="1"> <tr> <c:forEach var="j" begin="1" end="${param.k}" step="1"> <td> & nbsp; </td> </c:forEach> </tr> </c:forEach> </table> </c:when> …
Térjünk át a színezésre. A két ciklus mindegyikének lefutása alatt van egy értéke, ezek i és j. A feladat: a cellák színe váltokozzon. Erre a legegyszerűbb megoldás, ha nézzük i és j kettővel való osztás utáni maradékának eredményét, ergo, hogy páros, vagy páratlan-e. A következő kifejezés pont erre szolgál:
((i + j) mod 2) == 0 Így a kódunk a következőre módosul: ... <c:forEach var="j" begin="1" end="${param.k}" step="1"> <c:choose> <c:when test="${((i + j) mod 2) == 0}"> <td bgcolor="#000000">& nbsp;</td> </c:when> <c:otherwise> <td>& nbsp;</td> </c:otherwise> </c:choose> </c:forEach> ...
Egyetlen dolog maradt hátra, a <table> tag-nek megadni a border="1" attribútumot, illetve css-ben megadni a cellák magasságát illetve szélességét.
td { width: 40px; height: 40px; }
Íme, a teljes fájl:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@ page contentType="text/html;charset=windows-1250"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"/> <title>index</title> <style type="text/css"> td { width: 40px; height: 40px; } </style> </head> <body> <c:choose> <c:when test="${!empty param.k}"> <table border="1"> <c:forEach var="i" begin="1" end="${param.k}" step="1"> <tr> <c:forEach var="j" begin="1" end="${param.k}" step="1"> <c:choose> <c:when test="${((i + j) mod 2) == 0}"> <td bgcolor="#000000"></td> </c:when> <c:otherwise> <td> </td> </c:otherwise> </c:choose> </c:forEach> </tr> </c:forEach> </table> </c:when> <c:otherwise> Adj meg k paraméternek értéket! </c:otherwise> </c:choose> </body> </html>
2_feladat
Először is, adjunk hozzá a 2_feladat projektünkhöz egy Bean-t. (Ezt a projekt nevén jobb gombbal kattintva tehetjük meg, a New... lehetőséggel. Ezután válasszük a Generic lehetőségből a Java-t, ott pedig a Bean-t. A felugró ablakban állítsuk be a Package: mozi és a Name: jegy értékeket!) Ide fogjuk írni a feladat által megadott szabályokat, restrikciókat. Mivel a feladat része az is, hogyha bármilyen adatot helytelenül töltünk ki, a "Nem megfelelő adatok" üzenet jelenjen meg a kimeneten, a felsoroltakon kívül szükségünk lesz még egy Boolean változóra is. A szükséges változók:
package mozi; public class jegy { public jegy() { super(); } private String nev = ""; /* eloadas címe */ private String terem = ""; /* eloadas neve */ private Integer nap = 0; /* eloadas naptári napja */ private Integer fizetendo = 0; /* vegosszeg */ private Integer jegyszam = 0; /* rendelt jegyek darabszama */ private Boolean error = false; /* a "Nem megfelelo adatok" hibauzenet conrollerje */ private static final Integer EGYSEGAR = 1000; }
A változók deklarálása után a szükséges propertyk megírása következik, a feladat kiírása alapján. Propertyből kétféle létezik: az egyik az éppen kívánt változó értékét állítja be, míg ennek a "párja", amelyik ezt az értéket visszadja. Akit bővebben érdekel: <http://java.sun.com/j2se/1.4.2/docs/api/java/util/Properties.html>
public String getNev() { return this.nev; } public void setNev(String nev) { this.nev = nev; }
Ezek a propertyk az előbb deklarált 'nev' változót érintik. A 'getNev()' visszadja az értékét, a 'setNev()' pedig beállítja az attribútumként megadott értéket. Figyeljük meg, hogy különbözik az objektum típusa! Az első esetben előbb megadjuk, hogy szöveges változót kívánunk visszaadni, míg a második esetben attríbutumként adjuk meg, hogy a várt változó szöveges lesz (természetesen megadhatnánk teljesen eltérő változót is, de most a feladat szempontjából így a legegyszerűbb). A this operátor csupán arra utal, hogy nem az attribútum értékét kívánjuk változtatni - illetve visszaadni -, hanem az osztályban deklarált változóét!
Egészítsük ki most a feladatban megadott feltétellel kódunkat, mégpedig, hogy a név nem lehet üres, ha mégis, akkor pedig írjuk ki a "Nem megfelelő adatokat" a képernyőre. Ehhez szükségünk lesz az error get Property-jére is!
public String getNev() { return this.nev; } public void setNev(String nev) { if(nev != "") { this.nev = nev; } else { this.error = true; } } public Boolean getError() { return this.error; }
Ha ezzel megvagyunk, már csak az összes többire kell ugyanezt megtennünk, értelemszerűen a feladatból vett feltételekkel kiegészítve a set propertyket a teljes fájl így fog kinézni:
package mozi; public class jegy { public jegy() { super(); } private String nev = ""; /* eloadas címe */ private String terem = ""; /* eloadas neve */ private Integer nap = 0; /* eloadas naptári napja */ private Integer fizetendo = 0; /* vegosszeg */ private Integer jegyszam = 0; /* rendelt jegyek darabszama */ private Boolean error = false; /* a "Nem megfelelo adatok" hibauzenet conrollerje */ private static final Integer EGYSEGAR = 1000; public String getNev() { return this.nev; } public void setNev(String nev) { if(nev != "") { this.nev = nev; } else { this.error = true; } } public String getTerem() { return this.terem; } public void setTerem(String terem) { if (terem == "Nagyterem") { this.terem = terem; } else { this.error = true; } } public Integer getNap() { return this.nap; } public void setNap(Integer nap) { if (nap != 7 && nap != 14) { this.nap = nap; } else { this.error = true; } } public Integer getJegyszam() { return this.jegyszam; } public void setJegyszam(Integer jegyszam) { if (jegyszam > 0 && jegyszam < 7){ setFizetendo(jegyszam * EGYSEGAR); this.jegyszam = jegyszam; } else { this.error = true; } } public Integer getFizetendo() { return this.fizetendo; } public void setFizetendo(Integer fizetendo) { if (fizetendo > 0) { this.fizetendo = fizetendo; } else { this.error = true; } } public Boolean getError() { return this.error; } }
Mivel a feladatban az is szerepelt, hogy a fizetendő összegből kedvezményt is tudjunk adni, ezért amikor beállítjuk a jegyszámot, meghívjuk a fizetendő változót set propertyjét, így ha később kedvezményt akarunk adni, majd a jsp fájlunkból megtehetjük, ha azonban nem szeretnénk adni, be sem kell majd állítani ezt, hiszen a jegyszám beírásával ugyanezt az eredményt érjük el.
Kész van a Bean-ünk, mostmár csak használni kell! Adjunk hozzá a projekthez egy jsp fájlt is! Ebben fogjuk beállítani az egyes változókhoz tartozó értéket, illetve itt fogjuk megjeleníteni is azokat. Ahhoz, hogy mindezt megtehessük, a fájlban bárhova - érdemes a <%@ page %> után -, a következő sort illeszük be:
<jsp:useBean id="jegy" class="mozi.jegy" />
ez fogja jelezni scriptünknek, hogy melyik bean-t használja, illetve annak milyen nevet adunk (id). Állítsuk be a nev változónak az Anonymous értéket!
<jsp:setProperty name="jegy" property="nev" value="Anonymous" />
Nem szorul túl nagy magyarázásra, eléggé beszélő a parancs, de: a name változó hivatkozik a useBean parancs id attribútumára, ergo itt mondjuk meg, hogy melyik bean-ben lévő változót szeretnénk beállítani, a property a változó nevére vonatkozik, míg a value annak értékét állítja be. Legyenek most a válatozók a következők:
<jsp:setProperty name="jegy" property="nev" value="Anonymous" /> <jsp:setProperty name="jegy" property="terem" value="Nagyterem" /> <jsp:setProperty name="jegy" property="nap" value="26" /> <jsp:setProperty name="jegy" property="jegyszam" value="3" />
Szándékosan nem fogjuk most megadni a fizetendő végösszeget. Annyi maradt hátra, hogy ezeket az értékeket ki is írassuk a kimenetre, ezeket EL segítségél fogjuk megtenni, egy listában:
<ul> <li>Név: ${jegy.nev}</li> <li>Terem: ${jegy.terem}</li> <li>Nap: ${jegy.nap}</li> <li>Jegyszám: ${jegy.jegyszam}</li> <li>Fizetendő: ${jegy.fizetendo}</li> </ul>
Utolsóként az adatok ellenőrzése maradt, tehát meg kell vizsgálnunk az error változó értékét, hogy hamis-e, mert ha nem, hibával dolgozunk, így ki kell írnunk a Nem megfelelő adatok tájékoztatást a böngészőbe!
<c:choose> <c:when test="${!jegy.error}"> ... </c:when> <c:otherwise> <h1>Nem megfelelő adatok!</h1> </c:otherwise> </c:choose>
A teljes fájl:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@ page contentType="text/html;charset=windows-1250"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <jsp:useBean id="jegy" class="mozi.jegy" /> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1250"/> <title>index</title> </head> <body> <jsp:setProperty name="jegy" property="nev" value="Anonymous" /> <jsp:setProperty name="jegy" property="terem" value="Nagyterem" /> <jsp:setProperty name="jegy" property="nap" value="26" /> <jsp:setProperty name="jegy" property="jegyszam" value="3" /> <c:choose> <c:when test="${!jegy.error}"> <ul> <li>Név: ${jegy.nev}</li> <li>Terem: ${jegy.terem}</li> <li>Nap: ${jegy.nap}</li> <li>Jegyszám: ${jegy.jegyszam}</li> <li>Fizetendő: ${jegy.fizetendo}</li> </ul> </c:when> <c:otherwise> <h1>Nem megfelelő adatok!</h1> </c:otherwise> </c:choose> </body> </html>
3_feladat
A két kapott fájlt másoljuk be a projektbe: az AddCookieTag.java fájlt az src/zh/AddCookieTag.java útvonalra, a sutitad.jsp fájlt pedig a public_html/sutitad.jsp helyre. Ha ezzel megvagyunk megírhatjuk a tagkönyvtárat. Jobb gomb a 3_feladat projekten, New...

Ha mindent jól csináltatok, akkor a következő kód fog fogadni titeket:
<?xml version = '1.0' encoding = 'windows-1250'?> <taglib xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-jsptaglibrary_2_1.xsd" version="2.1" xmlns="http://java.sun.com/xml/ns/javaee"> <display-name>taglib</display-name> <tlib-version>3.0</tlib-version> <short-name>taglib</short-name> <uri>/WEB-INF/taglib</uri> </taglib>
Nézzük meg az AddCookieTag.java fájlt. A tagkönyvtáraknak egy kötött struktúrájuk van, csak úgy mint az RSS csatornáknak, vagy az egyes verziókövetési programoknak. Ezért a .tld fájlunkban szereplő XML kód még nem elég, itt fel kell sorolnunk legalább a következőket: a nevet, a class-t és a változókat. Erre egyszerűen csak a következő kódot fogjuk beírni a taglib.tld-be:
<tag> <name>cookieSet</name> <tag-class>zh.AddCookieTag</tag-class> <body-content>empty</body-content> <attribute> <name>name</name> </attribute> <attribute> <name>value</name> </attribute> <attribute> <name>maxAge</name> </attribute> </tag>
A teljes fájl pedig így néz ki:
<?xml version = '1.0' encoding = 'windows-1250'?> <taglib xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-jsptaglibrary_2_1.xsd" version="2.1" xmlns="http://java.sun.com/xml/ns/javaee"> <display-name>taglib</display-name> <tlib-version>3.0</tlib-version> <short-name>taglib</short-name> <uri>/WEB-INF/taglib</uri> <tag> <name>cookieSet</name> <tag-class>zh.AddCookieTag</tag-class> <body-content>empty</body-content> <attribute> <name>name</name> </attribute> <attribute> <name>value</name> </attribute> <attribute> <name>maxAge</name> </attribute> </tag> </taglib>
Source
A megoldást zipelve innen, illetve a tantárgy oldaláról tölthetitek le

JSP segédlet - MintaZH megoldás

1_feladat

2_feladat

3_feladat

Source