39
Tables und weitere Elemente Ralf Gitzel [email protected] 1

Ralf Gitzel 1 ralf [email protected]/JEE-16-06-Tables_und_weitere_Elemente.pdf · [email protected] 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

  • Upload
    others

  • View
    2

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Tables und weitere Elemente

Ralf [email protected]

1

Page 2: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Themenübersicht

Ralf [email protected]

2

Page 3: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Übersicht

• Übergreifendes Beispiel:Kühlschrankverwaltung

• Weitere JSF-Tags• Tables

3

Page 4: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Beispiel:Kühlschrankverwaltung

Ralf [email protected]

4

Page 5: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Problem

5

Was ist alles im Kühlschrank?Was muss aufgebraucht werden?

Page 6: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Lösung

6

Mini-JEE Server

Web Applikation zur Verwaltungvon Lebensmitteln

Page 7: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Applikation – Einkaufregistrieren

7

Page 8: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Applikation – Was mussverbraucht werden?

8

Page 9: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Weitere JSF Tags

Ralf [email protected]

9

Page 10: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Radiobuttons

10

1. Verknüpfung zumProperty derMangedBean

2. Liste der möglichenWertea. Explizit im HTML-

Codeb. Über eine Liste aus

der Bean

Page 11: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

h:selectOneRadio• Radiobuttons• Der Inhalt kann auf verschiedene Weise bereitgestellt

werden (f:selectItem, f:selectItems)

11

Attribut Verwendungszweckvalue Das Property in der ManagedBean, das über die

Radiobuttons verändert wird

layout Richtung der Buttons – „lineDirection“ oder„pageDirection“

Page 12: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

f:selectItem• Ein explizit auswählbares Element, fest im HTML-Code

beschrieben

12

Attribut VerwendungszweckitemValue Ist dieser Button ausgewählt, so wird dieser Wert in

das Property geschrieben

itemLabel Der Beschreibungstext am Button

Page 13: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

f:selectItem - Beispiel

13

Page 14: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

f:selectItems• Verwendung einer Collection, Liste, eines Vektors, der

in der ManagedBean angelegt wurde

14

Attribut Verwendungszweckvalue Name des Properties in dem die Listenelemente

gespeichert sindvar Das aktuelle Element aus ‚value‘itemValue Ist dieser Button ausgewählt, so wird dieser Wert in

das Property geschriebenitemLabel Der Beschreibungstext am Button

Page 15: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

f:selectItems - Beispiel

15

Value „Obst“

„Gemüse“

Page 16: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Diskussion: Drop Down Listen

16

Wie könnte dasfunktionieren?

Page 17: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

h:selectOneMenu• Drop Down Liste• Der Inhalt kann auf verschiedene Weise bereitgestellt

werden (f:selectItem, f:selectItems), identisch zuRadiobuttons

17

Attribut Verwendungszweckvalue Das Property in der ManagedBean, das über die

Radiobuttons verändert wird

Page 18: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Tables

Ralf [email protected]

18

Page 19: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Verwendungszweck

• Einfache Darstellung von Collections• Erzeugt eine Tabelle, d.h. etwas

spezieller als repeat

19

Page 20: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Beispiel einer Anwendung

20

Page 21: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Beispiel einer Anwendung

21

Page 22: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

h:dataTable• Eine Tabelle mit frei definierbaren Spalten

22

Attribut Verwendungszweckvalue Die Collection über die iteriert wird (ähnlich wie bei

repeat)

var Der Variablenname, der für den aktuellem Eintrag inder der Tabelle steht

border Der Rand der Tabellefirst Erstes Element aus der Collection, dass angezeigt wirdrows Anzahl der Zeilen, die angezeigt werden (ab ‚first‘)styleClass, captionClass, headerClass, footerClass, rowClasses,columnClasses

Page 23: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

h:column• Eine Spalte in der Tabelle• Anmerkung: Es gibt keine Zeilen, diese werden

automatisch je nach Collectiongröße erzeugt

23

Attribut Verwendungszweck

Page 24: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Tabelle - Zeilen

24

Value:Sammlung(z.B. Liste)

aller „Zeilen“

Element 1

Element 2

Element 3

Var: Zeiger aufaktuelles Element

Page 25: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Tabelle - Spalten

25

Element 1 Var: Zeiger aufaktuelles Element

Column: Inhaltebasierend auf aktuellem

Element

Page 26: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Aufgebaute Tabelle

26

Page 27: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

h:facet• Wird benutzt um Überschriften, Unterschriften und

Kommentare zu definieren

27

Attribut Verwendungszweckname Kann „header“, „footer“ oder „caption“ sein

Page 28: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Tabelle – Header und Footer

28

Page 29: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Diskussion: EditierbareTabellen

29

Wie realisiert maneditierbare Spalten?

Page 30: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Editierbare Spalte

30

Jedes beliebige Tag kann in der Spalte verwendet werden,z.B. für Textinput etc.

Page 31: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Lernziele

Ralf [email protected]

31

Page 32: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Lernziele

• Radiobuttons und Drop Down Listenverwenden können

• Tabellen erstellen können (aucheditierbare)

32

Page 33: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Praxisbeispiel

Ralf [email protected]

33

Page 34: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Andere Teilbereiche der BWL• Bereich: Lebenszyklusmanagement• Echtes Beispiel aus unserer

Entwicklungsarbeit• Problem: Verwaltung der Ergebnisse von

Fehleranalysen an Produkten undErstellung von Fehlercodes

• Techniker gibt Problembeschreibunganhand von Fragelisten ein, Fehlercodewird erstellt

• Liste empfohlener Maßnahmen wirdgeneriert

34

Page 35: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Fault Code Generator

35

Page 36: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Übungsaufgabe

Ralf [email protected]

36

Page 37: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Codeanalyse

• Betrachtung einer fertigen Applikation• Ziel ist es, zu verstehen, was im Code

passiert und wo ein Effekt ausgelöst wird

• Eine aktuelle Studie unterstreicht den Lerneffekt des Codelesens gegenüber demexperimentellen Programmieren: http://cacm.acm.org/magazines/2015/2/182637-whats-the-best-way-to-teach-computer-science-to-beginners/fulltext

37

Page 38: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Fragen• ManagedBeans

– Welche ManagedBeans gibt es?– Wann werden diese angelegt?– Wer kann auf sie zugreifen?– Wie sind sie miteinander verbunden?

• Navigation– Welche Stellen im Code beschreiben die

Navigation?– Welcher Code wird ausgeführt, wenn man auf der

Seite AusbuchbarerStatus.jsf auf den Buttondrückt? Auf welcher Seite landet man danach?Warum?

38

Page 39: Ralf Gitzel 1 ralf gitzel@hotmailralf-gitzel.info/JEE-16-06-Tables_und_weitere_Elemente.pdf · ralf_gitzel@hotmail.de 9. Radiobuttons 10 1. Verknüpfung zum Property der MangedBean

Fragen

• Unterkategorie.xhtml:– Welche Klassen werden von der Tabelle genutzt?– Wie ist der Ausdruck

„#{konstanten.wertelisten[element.typ.einheit]}“ zuverstehen?

• Kühlschrankinhalt– Wo wird gespeichert was sich im

Kühlschrank befindet?– Was passiert, wenn man 5 Äpfel einbucht,

aber noch 3 im Kühlschrank sind?39