Internetapplicaties - VI Herhaling 1 Internetapplicaties Deel 6: Herhaling.

Presentatie over: "Internetapplicaties - VI Herhaling 1 Internetapplicaties Deel 6: Herhaling."— Transcript van de presentatie:

1 Internetapplicaties - VI Herhaling 1 Internetapplicaties Deel 6: Herhaling

2 Internetapplicaties - VI Herhaling2 Doelstelling  Parate kennis krijgen over technieken die we nog nodig gaan hebben.  Overzicht behouden. N.B.: Wat we nu vooral nog missen is: -> kennis over databases en client-server -> kennis over internet security

3 Internetapplicaties - VI Herhaling3 Inhoud  6.1 forms, request:  voorbeeld+werking+opgave  bestanden broodjes.html, verwerk.jsp  6.2 jsp-beans:  voorbeeld+werking+opgave  bestanden Persoon.java, persoonBean.jsp  6.3 collecties:  voorbeeld+werking+opgave  bestanden Leerling.java  6.4 sessies:  voorbeeld+werking+opgave  bestanden Koop.jsp, Winkelkar.java

4 Internetapplicaties - VI Herhaling4 6.1 forms, request  U heeft folder en bestand: c:\jakarta-tomcat- 4.1.27\webapps\hfdst2\Broodjes.html

5 Internetapplicaties - VI Herhaling5 Opmerkingen  action-attribuut van de form-tag:  bepaalt wat er moet gebeuren als de submit-knop wordt geactiveerd  Zal bij ons een jsp-bestand aanroepen. zie verder  method-attribuut van de form-tag:  get: de ingegeven data worden achteraan de URL-geplakt als volgt:  Verwerk.jsp?naam=niki+meulemans&adres=naamsevest+96  post: de doorgegeven data zijn onzichtbaar  name-attribuut van diverse tags:  dient om naar de ingegeven invoer te kunnen verwijzen tijdens de verwerking door de jsp-code)

6 Internetapplicaties - VI Herhaling6 Opmerkingen: radio-knop  De -control:  Bij elkaar horende radio-knoppen moeten dezelfde naam dragen. Selecties sluiten elkaar dan uit.  Door checked te schrijven, is deze knop default geselecteerd  De value=“..” bepaalt de waarde tijdens de verwerking, maar is niet zichtbaar op de pagina <input name = "levering" type = "radio“ <input name = "levering" type = "radio“ value = "Winkel"> Winkel value = "Winkel"> Winkel <input name = "levering" type = "radio“ <input name = "levering" type = "radio“ value = "Thuis“ checked > Thuis value = "Thuis“ checked > Thuis

7 Internetapplicaties - VI Herhaling7 Opmerkingen: checkbox  De -control:  Bij elkaar horende checkboxen kunnen dezelfde naam dragen  De value=“..” bepaalt de waarde tijdens de verwerking, maar is niet zichtbaar op de pagina <input type = "checkbox" name = "Soms Kaas“ <input type = "checkbox" name = "Soms Kaas“ Value = "Yes" >Smos Kaas Value = "Yes" >Smos Kaas  In geval 2 checkboxen zelfde naam hebben & beide aangeklikt zijn: beide values woren doorgegeven: < input type = "checkbox" name = “Broodjes“ < input type = "checkbox" name = “Broodjes“ Value = “Kaas" >Smos Kaas (NIET BIJ ONS !!!) Smos Kaas (NIET BIJ ONS !!!)<input type = "checkbox" name = “Broodjes“ Value = “Hesp" >Smos Hesp (NIET BIJ ONS !!!)

8 Internetapplicaties - VI Herhaling8 Extra controls: select-listbox, reset- knop …<b>Grootte</b><br> piccolo/option> piccolo/option> half stokbrood half stokbrood heel stokbrood heel stokbrood </form>…

9 Internetapplicaties - VI Herhaling9 Opmerkingen: select  De -control:  Geeft drop-down listbox of multi-select listbox.  Via …, verschillende keuzes aangeven  Er is 1 naam voor alle opties.  Door selected te schrijven, is deze option default geselecteerd.

10 Internetapplicaties - VI Herhaling10 select (vervolg)  Multiple attribuut (niet in onze code)  Maakt keuze van verschillende opties tegelijk mogelijk (CTRL+klik)  In geval meer dan 1 keuze gemaakt is: beide values woren doorgegeven: mosterd (NIET BIJ ONS !!!) mosterd (NIET BIJ ONS !!!) ketchup (NIET BIJ ONS !!!) ketchup (NIET BIJ ONS !!!)

11 Internetapplicaties - VI Herhaling11 select (vervolg)  value attribuut (niet in onze code)  Als die er is wordt de bebehorende value doorgegeven bij selectie.  Als die ontbreekt, wordt tekst tussen doorgegeven bij selectie.  Belangrijk als je denkt dat de zichtbare tekst meer veranderlijk is dan de values getrouwd getrouwd alleenstaand alleenstaand weduwe/naar weduwe/naar

12 Internetapplicaties - VI Herhaling12 Opmerkingen: reset-knop  De -control:  Functie is vast bepaald: Leegmaken van de invoervelden  Value-attribuut geeft de tekst in de knop weer

13 Internetapplicaties - VI Herhaling13 JSP-verwerking  Tot nog toe konden we met de ingevoerde gegevens niets doen  N.B. Wat we nu hier zullen doen, hadden we ook in (door client zichtbare) JavaScript gekund.

14 Internetapplicaties - VI Herhaling14 JSP-verwerking  U heeft het bestand: c:\jakarta-tomcat- 4.1.27\webapps\hfdst2\verwerk.jsp

15 Internetapplicaties - VI Herhaling15 Opmerkingen    request-object is impliciet (is al gecreëerd)  type is de klasse HttpServletRequest  1 van de methodes: getParameter()  geeft de value bij de gegeven naam terug

16 Internetapplicaties - VI Herhaling16 Opmerkingen  Ook mogelijk: opvang van meerdere waarden tegelijk, horend bij name/value pairs die zelfde naam dragen. (niet bij ons)  Opvang in array van Strings via getParameterValues()  Vb: <% String[] sauzen = request.getParameterValues(“saus")); out.println(sauzen[1]);… %> %>

17 Internetapplicaties - VI Herhaling17 6.2 jsp-beans: Voorbeeldje  U heeft volgend bestand: c:\jakarta-tomcat-4.1.24\webapps\hfdst3\WEB- INF\classes\be\scvobirm\personen\Persoon.java

18 Internetapplicaties - VI Herhaling18  U heeft volgend bestand: c:\jakarta-tomcat- 4.1.27\webapps\hfdst3\persoon.jsp c:\jakarta-tomcat- 4.1.27\webapps\hfdst3\persoon.jsp jsp-beans: Voorbeeldje jsp-beans: Voorbeeldje

19 Internetapplicaties - VI Herhaling19 Java Beans en JSP: Bean TAGS persoonBean.jsp: Opmerkingen   >>> Een bean-object genaamd 'ik' van type Persoon wordt gedeclareerd en gecreeerd.   >>> Oproep van getter ik.getVoornaam(), het resultaat wordt afgedrukt op het scherm.   >>> Oproep van setter ik.setVoornaam("Jantje"), GEEN afdruk op het scherm.   >>> Gewone jsp-script-code kan zonodig gemixt worden met tags in 1 pagina

20 Internetapplicaties - VI Herhaling20 6.3 Collecties: ArrayList  Is een klasse die de List interface implementeert  Dit betekent dat bepaalde methode-namen van de List interface van een implementatie zijn voorzien.  We vertrekken weerom van een voorbeeldje dat we achteraf van opmerkingen voorzien.  N.B. 1 Voor de duidelijkheid hoor je eigenlijk elk statement op een nieuwe lijn te beginnen.  N.B. 2 Voor grotere systemen hoor je elke identifier een lange betekenisvolle naam te geven.

21 Internetapplicaties - VI Herhaling21 ArrayList: Voorbeeldje  U heeft folder en bestand: c:\jakarta-tomcat-4.1.24\webapps\ hfdst4\WEB-INF\classes\be\scvobirm\hulp\ hfdst4\WEB-INF\classes\be\scvobirm\hulp\ Leerling.java Leerling.java

22 Internetapplicaties - VI Herhaling22 Compilatie naar bytecode  Compilatie in een dosbox: c:\jakarta-tomcat-4.1.27\webapps\hfdst4\WEB- INF\classes>javac be\scvobirm\hulp\Leerling.java c:\jakarta-tomcat-4.1.27\webapps\hfdst4\WEB- INF\classes>javac be\scvobirm\hulp\Leerling.java  Uitvoeren van de bytecode: c:\jakarta-tomcat-4.1.27\webapps\hfdst4\WEB- INF\classes>java be.scvobirm.hulp.Leerling c:\jakarta-tomcat-4.1.27\webapps\hfdst4\WEB- INF\classes>java be.scvobirm.hulp.Leerling

23 Internetapplicaties - VI Herhaling23 Resultaat

24 Internetapplicaties - VI Herhaling24 Opmerkingen  import java.util.*; betekent: alle klassen in dit pakket. We haddden ook ArrayList ipv * kunnen importeren.  List pot; pot = new ArrayList(); pot = new ArrayList(); pot ondersteunt de List interface Maar er wordt een ArrayList object aan toegekend. Nu kan pot alleen de methoden van ArrayList die ook in List te vinden zijn, oproepen !! pot is nu een leeg ArrayList-object

25 Internetapplicaties - VI Herhaling25 Opmerkingen  p1 = new Leerling("Piet","03 12 34 56"); p1 wordt gecreëerd met al zijn attributen als parameter. Er zijn geen public setters voorzien in Leerling.java  pot.add(p1); pot.add(p2);  Een List-object kan als elementen objecten van het type Object bevatten. Leerling is een subklasse van Object.  add behoort tot de List interface. Het voegt het object in de parameter toe aan de lijst.  p1 is een Leerling en dus een Object en mag dus toegevoegd worden.

26 Internetapplicaties - VI Herhaling26 Opmerkingen  for(int i=0 ; i < list.size() ; i++)  size() behoort ook to de List interface. Het geeft het aantal elementen in de lijst.  pp = (Leerling) list.get(i);  get(i) geeft het elemeten op positie i terug. (tellen vanaf 0). get(int) behoort ook tot de List interface.  Collecties bevatten objecten van de klasse Object. Ze moeten geDOWNCAST worden naar specifiekere subklassen.  list.get(i) moet gedowncast worden naar Leerling alvorens ze kan toegekend worden aan pp, die van de klasse Leerling is.

27 Internetapplicaties - VI Herhaling27 ArrayList: extra methoden // Deze code komt NIET uit het voorbeeldje: ArrayList ar = new ArrayList; ar.add(“A”); // pos 0 ar.add(“B”); // pos 1 // -> A, B ar.add(1,“C”); // “B” schuift nu op naar pos 2 // ->A, C, B Ar.remove(0); // -> C, B

28 Internetapplicaties - VI Herhaling28 6.4 Sessions We herhalen de Winkelkar-applicatie. U heeft folders en bestand: c:\jakarta-tomcat-4.1.27\webapps\hfdst5\ WEB-INF\classes\be\scvobirm\sessies\Winkelkar.java U heeft dit bestand: c:\jakarta-tomcat-4.1.27\webapps\hfdst5\Koop.jsp

29 Internetapplicaties - VI Herhaling29 Winkelkar.java: Opmerkingen  public ArrayList getKar(){ ArrayList kopie = new ArrayList(); ArrayList kopie = new ArrayList(); kopie.addAll(kar); kopie.addAll(kar); return kopie; return kopie;} Waarom niet return kar ??? OO basisprincipe: operaties op attributen mogen alleen gebeuren via speciaal daarvoor voorziene methoden. Waarom niet return kar ??? OO basisprincipe: operaties op attributen mogen alleen gebeuren via speciaal daarvoor voorziene methoden. kar teruggeven zou betekenten dat de client de lijst kan aanvullen of verkleinen zonder de door Winkelkar voorziene methoden te gebruiken.

30 Internetapplicaties - VI Herhaling30 Winkelkar.java: Opmerkingen  public void processRequest(){ if (submit != null) if (submit.equals("toevoegen")) if (submit.equals("toevoegen")) kar.add(produkt); kar.add(produkt); else // sumit.equals(“verwijderen“) else // sumit.equals(“verwijderen“) kar.remove(produkt); kar.remove(produkt);…} We gaan er hier van uit dat submit de actie bevat die we moeten uitvoeren. Produkt bevat het laatst gespecifieerde produkt. processRequest is de enige methode voor clients om produkten toe te voegen of te verwijderen.

31 Internetapplicaties - VI Herhaling31 1e bezoek

32 Internetapplicaties - VI Herhaling32 Opmerkingen 1e bezoek  1e bezoek aan de pagina:  De product drop down list wordt getoond  De request parameter “submit” bestaat NIET, submit is dus null. Stel, de gebruiker selecteert ‘danioke‘ en drukt op de submit-knop…  De url http://localhost:8080/hfdst5/ http://localhost:8080/hfdst5/ Koop.jsp?produkt=danioke&submit=toevoegenKoop.jsp?produkt=danioke&submit=toevoegen wordt naar de server gestuurd. (parameters zichtbaar als method = “get”) Koop.jsp?produkt=danioke&submit=toevoegen

33 Internetapplicaties - VI Herhaling33 2e bezoek

34 Internetapplicaties - VI Herhaling34 Opmerkingen 2e bezoek  2e bezoek aan de pagina:  De product drop down list wordt getoond  De request parameter “submit” bestaat nu WEL, en de submit-variabele is nu “toevoegen”.  De request bevat ook nog het produkt.  Beide parameters worden automatisch in de karbean gezet o.a. m.b.v. deze code:

35 Internetapplicaties - VI Herhaling35 Opmerkingen 2e bezoek (vervolg)  De karbean wordt aangevuld met het produkt (processRequest), gekozen tijdens het 1e bezoek.  De arraylist die de strings van produkten bevat wordt doorlopen. Voor elk produkt wordt een extra rij toegevoegd aan de html-tabel van produkten. Stel, de gebruiker klikt op de ’verwijderen’-link naast ‘danioke‘ in de productentabel… Stel, de gebruiker klikt op de ’verwijderen’-link naast ‘danioke‘ in de productentabel…  De url http://localhost:8080/hfdst5/ http://localhost:8080/hfdst5/ http://localhost:8080/hfdst5/Koop.jsp?produkt=danioke&submit=verwijderen wordt naar de server gestuurd.

36 Internetapplicaties - VI Herhaling36 3e bezoek

37 Internetapplicaties - VI Herhaling37 Opmerkingen 3e bezoek  3e bezoek aan de pagina  De code zorgt nu dat de parameters product=danioke&submit=verwijderen in de karbean worden bewaard zorgt nu dat de parameters product=danioke&submit=verwijderen in de karbean worden bewaard  karbean.processRequest() zal dit keer het gegeven produkt uit de lijst verwijderen  Het feit dat intern de karbean binnen het session-object wordt bewaard, maakt dat doorheen verschillende bezoeken, de winkelkar zijn produkten onthoudt.