Übung 1.5: Eine Aktualisierungsseite erstellen

Bevor Sie beginnen, müssen Sie Übung 1.4: Neue Datensätze erstellen vollständig bearbeitet haben.

Bisher haben Sie Seiten zum Anzeigen und Erstellen von Einträgen für die Website erstellt. In dieser Übung erstellen Sie eine Seite, über die Benutzer Einträge aktualisieren und löschen können. Die Aktualisierungsseite ist fast mit der Erstellungsseite identisch. Die einzige Ausnahme ist, dass die Eingabefelder auf der Aktualisierungsseite Daten aus einem bereits vorhandenen Datensatz enthalten, die der Benutzer ändern kann.

Zunächst erstellen Sie einen relationalen Datensatz, der einen bereits vorhandenen Datensatz aus der Datenbank darstellt. Als Nächstes erstellen Sie ein JavaServer Faces-Aktualisierungsformular für diesen relationalen Datensatz, und nach einigen kleinen Änderungen ist Ihre Seite bereit zum Testen.

Den relationalen Datensatz für die Aktualisierung erstellen

Anzeige
  1. Öffnen Sie die Datei update_record.jsp, indem Sie in der Ansicht 'Projekt-Explorer' doppelt auf diese Datei klicken.
  2. Löschen Sie den Standardtext Hier Inhalt einfügen.
  3. Klicken Sie in der Ansicht "Palette" auf den Drawer Daten, um ihn zu erweitern.
  4. Ziehen Sie die Komponente Relationaler Datensatz von der Palette in den leeren Inhaltsbereich. Das Fenster Relationalen Datensatz hinzufügen wird geöffnet.
  5. Geben Sie im Feld Name update_record ein.
  6. Klicken Sie unter Steuerelemente erstellen für auf Aktualisieren eines bestehenden Datensatzes.
  7. Stellen Sie sicher, dass die Option Eingabe-/Ausgabesteuerelemente zur Anzeige des relationalen Datensatzes auf einer Webseite hinzufügen ausgewählt ist.
  8. Klicken Sie auf Weiter.
  9. Klicken Sie im Fenster Tabelle auf die Tabelle W5SAMPLE.ADS.
  10. Klicken Sie auf Weiter. Die Seite 'Spaltenauswahl und andere Tasks' wird geöffnet.

Die Ergebnisse filtern

Anzeige

Ein relationaler Datensatz kann lediglich einen einzelnen Satz aus der Datenbank anzeigen. Daher müssen Sie die Datenbanktabelle so filtern, dass nur ein vom Benutzer zu bearbeitender Datensatz angezeigt wird. (In der vorherigen Übung mussten Sie die Datenbank nicht filtern, da Sie einen neuen Datensatz erstellt haben, sodass keine zu filternden Ergebnisse aus der Datenbank vorlagen.) Da jeder Datensatz in der Datenbank über eine eindeutige ID-Nummer verfügt, werden die Ergebnisse für den Satz mit einer bestimmten ID-Nummer gefiltert.

  1. Klicken Sie unter Tasks auf Ergebnisse filtern. Das Fenster 'Filter' wird geöffnet und fügt die standardmäßige Filterbedingung ID = #{param.ID} der Spalte Filter hinzu.

    Das Fenster 'Filter' sieht folgendermaßen aus:

    Das Fenster 'Filter'

    Dieser Code filtert die Datensätze in der Datenbank so, dass lediglich der Datensatz mit der angegebenen ID-Nummer im relationalen Datensatz angezeigt wird. Im Abschnitt 'Einen Hyperlink einfügen' weiter unten in dieser Übung erfahren Sie mehr über diese Filterbedingung.

  2. Klicken Sie auf Schließen.
  3. Klicken Sie auf Weiter. Die Seite "Datensteuerelemente konfigurieren" wird geöffnet.
  4. Nehmen Sie im Abschnitt Angezeigte Felder die Auswahl des Markierungsfelds neben allen Feldnamen zurück, die nicht angezeigt werden sollen, sodass nur die Markierungsfelder neben den Feldnamen ausgewählt bleiben, die in Ihrem Eingabeformular erscheinen sollen:
  5. Ändern Sie die Reihenfolge der Feldnamen wie folgt von oben nach unten, indem Sie entsprechend auf die Pfeile für Aufwärts bzw. Abwärts klicken:
    1. ID
    2. TITEL
    3. BESCHREIBUNG
    4. HAUPTKATEGORIE
    5. PREIS
    6. TELEFONNUMMER
  6. Wählen Sie für das ID-Feld Ausgabefeld aus der Dropdown-Liste in der Spalte Steuerungstyp aus.

    Obwohl es sinnvoll ist, Benutzern die Möglichkeit zu geben, die ID-Nummer eines Datensatzes anzuzeigen, sollten sie nicht in der Lage sein, den entsprechenden Satz zu aktualisieren. Durch Definition des ID-Felds als Ausgabefeld kann das Problem doppelter IDs umgangen werden.

  7. Klicken Sie auf Optionen. Das Fenster Optionen wird geöffnet.
  8. Stellen Sie sicher, dass die Option Schaltfläche 'Übergeben' ausgewählt ist.
  9. Geben Sie Aktualisieren im Feld Bezeichnung ein.
  10. Klicken Sie auf OK.
  11. Das Fenster Relationalen Datensatz hinzufügen sollte folgendermaßen aussehen:

    Fenster 'Relationalen Datensatz hinzufügen'

  12. Klicken Sie auf Fertig stellen, um Ihr Aktualisierungsformular auf der Seite zu generieren, wie nachfolgend gezeigt:

    Aktuelle Darstellung der Seite

Die Schaltfläche 'Aktualisieren' programmieren

Anzeige

Sie werden erneut Code hinzufügen, um den Benutzer auf die Seite 'all_records.jsp' zu verweisen, um den geänderten Datensatz zusammen mit allen anderen Datensätzen anzuzeigen.

  1. Klicken Sie auf die Schaltfläche Aktualisieren, die Sie soeben auf der Webseite erstellt haben.
  2. Öffnen Sie die Ansicht 'Schnellbearbeitung'.
  3. Platzieren Sie den Cursor in der Ansicht 'Schnellbearbeitung' durch Klicken genau vor dem Code return "";.
  4. Drücken Sie die Eingabetaste. Vor return ""; wird eine neue Zeile angezeigt.
  5. Klicken Sie mit der rechten Maustaste auf die Leerzeile und wählen Sie anschließend Snippet einfügen > Wechseln zu Seite aus dem Kontextmenü aus. Das Fenster 'Aktion 'Wechseln zu Seite' editieren' wird geöffnet.
  6. Wählen Sie aus der Dropdown-Liste den Eintrag all_records.jsp als Zielseite aus.
  7. Klicken Sie auf OK.
  8. Der Ereigniscode für Ihre Schaltfläche sollte folgendermaßen aussehen:

    Codebeispiel

    Wenn ein Benutzer nun einen Datensatz aktualisiert, leitet die Seite den Browser auf die Seite 'all_records.jsp' um, um anzuzeigen, dass der Datensatz geändert wurde. Auch die Schaltfläche für Löschen sollte den Benutzer zurück auf die Seite 'all_records.jsp' verweisen.

  9. Wiederholen Sie die Schritte 1 bis 7, um den Code in gleicher Weise für die Schaltfläche Löschen auf der Webseite zu editieren.
  10. Speichern Sie die Seite.

Einen Hyperlink einfügen

Anzeige

Als nächstes werden Sie Links für die Seite 'all_records.jsp' erstellen, damit der Benutzer einen Datenbanksatz auswählen kann, der aktualisiert werden soll. #{param.ID} stellt die ID-Nummer des Datensatzes dar, der auf der Aktualisierungsseite aktualisiert werden soll. Wenn der Benutzer auf den Link eines Datensatzes klickt, wird die ID-Nummer des betreffenden Satzes als Parameter #{param.ID} an die Seite 'update_record.jsp' gesendet. Anschließend wird der gefilterte relationale Datensatz, den Sie soeben in die Seite 'update_record.jsp' eingefügt haben, ausschließlich den betreffenden Datensatz zum Aktualisieren anzeigen.

  1. Klicken Sie in der Ansicht 'Projekt-Explorer' doppelt auf die Datei all_records.jsp, um diese Datei im Editor zu öffnen.
  2. Klicken Sie auf eine beliebige Stelle in der Datentabelle.
  3. Öffnen Sie die Ansicht "Eigenschaften".
  4. Klicken Sie in der Ansicht 'Eigenschaften' in der Liste der HTML-Tags auf der linken Seite der Ansicht auf h:dataTable.
  5. Klicken Sie ganz rechts in der Ansicht 'Eigenschaften' auf Hinzufügen, um eine neue Spalte hinzuzufügen.
  6. Geben Sie Aktualisieren in das Feld Bezeichnung der neuen Spalte ein und drücken Sie die Eingabetaste. Eine Spalte mit der Bezeichnung 'Aktualisieren' wird in der Datentabelle generiert.
  7. Wählen Sie die neue Spalte in der Ansicht 'Eigenschaften' aus und klicken Sie solange auf Nach unten, bis sich die Spalte 'Aktualisieren' ganz rechts in der Datentabelle befindet.
  8. Klicken Sie in der Ansicht 'Palette' auf den Drawer Faces-Komponenten, um diesen Drawer zu erweitern.
  9. Ziehen Sie die Komponente Link von der Palette auf die soeben erstelle Spalte 'Aktualisieren'. Das Fenster 'URL konfigurieren' wird geöffnet.
  10. Geben Sie im Feld URL als Ziellink update_record.jsp ein und geben Sie Eintrag aktualisieren in das Feld Bezeichnung ein.
  11. Klicken Sie auf OK. Der Hyperlink 'Eintrag aktualisieren' wird in der Spalte 'Aktualisieren' angezeigt.
  12. Klicken Sie auf das Linksymbol Linksymbol neben dem Hyperlink Eintrag aktualisieren in der Spalte 'Aktualisieren'.
  13. Klicken Sie in der Ansicht 'Eigenschaften' auf die Registerkarte Parameter, die sich genau unter der Markierung 'hx:outputLinkEx' links in der Ansicht befindet.
  14. Klicken Sie auf Parameter hinzufügen und geben Sie anschließend ID in das Feld Name ein.

    Sie müssen den Parameter ID an die Spalte ID im Eingabeformular binden. Den Hyperlinkparameter an die Spalte ID der Datenliste zu binden heißt, dass beim Anklicken des Hyperlinks die ID des Datensatzes in der Liste der Anforderungsparameter ist.

  15. Wählen Sie das Feld Wert aus und klicken Sie anschließend auf die Schaltfläche Seitendatenobjekt auswählen im Feld. Das Fenster 'Seitendatenobjekt auswählen' wird geöffnet.
  16. Klicken Sie unter Datenobjekte auf die Spalte ID aus der Satzliste all_recordlist(ADS), wie nachstehend gezeigt:

    Fenster 'Seitendatenobjekt auswählen'

  17. Klicken Sie auf OK.

    Wenn der Benutzer nun auf den Link 'Eintrag aktualisieren' klickt, kann er auf der Website Informationen über die entsprechende aktualisieren.

  18. Speichern Sie die Datei und testen Sie die Seite, wenn Sie möchten. Denken Sie daran, zunächst die Datei 'all_records.jsp' zu öffnen, da dies die Seite ist, die eine Verbindung zu 'update_record.jsp' herstellt.

In dieser Übung haben Sie gelernt, wie Webseiten erstellt werden, mit denen Datensätze in einer Datenbank aktualisiert werden können. Sie können nun mit Übung 1.6: Eine relationale Satzliste filtern beginnen.

Nutzungsbedingungen | Feedback
(C) Copyright IBM Corporation 2000, 2004. Alle Rechte vorbehalten.