---

Modul 9-Start

9.1: Einleitung und Generelles |
9.2: Web-Email-Feedback | Formulare | Formularverwendung und -aktionen
9.3: Serverkkonfigurierung, plugins und cgis | Datenbanksatzerstellung via Web |
Datenbanksuche via Web |Suchergebnisanzeige im Web | Datensatzeditierung via Web | 
vorformulierte Datenbankabfragen und db-basierte Webseiten |
Webseiten mit SSI, ASP, JSP, PHP, XML |
9.4: Zusammenfassung

Nun kehren wir zurück zu unseren Formularen. Wir verliesen sie ja beim Stand des Abschickens ins Webnirvana. Nehmen wir mal an, dass sie unseren Server erreicht haben und von diesem via cgi oder plugin einen Datenbankeintrag verursachen sollen.

Das Prinzip ist grundsätzlich bei allen Lösungen vergleichbar, wir wollen dies erst einmal theoretisch erklären.

Die Datenbankstruktur muss bekannt sein. Um dies zu erläutern, denken wir an folgende kleine Datenbank:

Name der Datenbank: paladressen

feldVorname
feldNachname
feldOrt
feldSpezialitaet
feldBesonderheiten

Die Datenbank besteht also aus 5 Feldern und hat den Namen paladressen.

Wir könnten die Datenbank nun direkt füttern, indem wir jedesmal einen neuen Datensatz anlegen und dann Eingaben in die Felder machen. Später können wir die Datenbank dann mit den eingebauten Suchoptionen durchsuchen. Dies ist für alle Datenbanken sehr vergleichbar, egal ob es FilemakerPro, Acces, SQL, Oracle usw. ist.

Wenn wir nun die Datenbank nicht von Hand füttern wollen, sonder die Bedienung über das Web ermöglichen wollen, müssen wir folgendes vornehmen:

• Webseite erstellen mit einem Eingabe-Formular
  
• Formular muss ebenfalls fünf Eingabefelder haben, die genauso heißen wie die entsprechenden Datenbankfelder.
• Der Typ der Eingabefelder ist prinzipiell egal. Für Vorname, Nachname, Ort wählen wir ein Textfeld, für Spezialitaet geben wir eine Auswahl mit einem Popup-Menu vor und für Besonderheiten sehen wir eine Textarea vor.
• Bei den Abschickaktionen muss der Pfad zum Webserver angegeben werden, der via cgi oder plugin zur Datenbank weitervermittelt. Diese Vermittlungsnotwendigkeit muss ebenfalls aus den abgeschickten Daten ersichtlich sein (z.B. durch Angabe des aufzurufenden cgi). Außerdem muss natürlich angegeben werden, in welche Datenbank wir die Daten als neuen Datensatz einladen wollen. Darüberhin muss angegeben werden, dass wir für die Daten einen neuen Datensatz anlegen wollen.
• Geben wir falsche Feldnamen an, wird es eine Fehlermeldung geben, da sich die Datenbank weigern wird, die Daten anzunehmen. Das cgi wird daraufhin eine Fehlermeldung produzieren und an den anfragenden Computer zurückschicken.

Wenn unsere Datenbank mit mehreren Datensätzen gefüttert ist, wollen wir sie vielleicht abfragen. Wir wollen z.B. alle Datensätze suchen, bei denen als Wohnort Hamburg angegeben ist und als Spezialität Dinosaurier, aber prinzipiell soll nach allen möglichen Kriterien gesucht werden.

• Dazu benötigen wir ein neues Abfrage-Formular, am besten auf einer neuen Webseite
• Wenn wir nach einer Kombination von Suchkriterien fragen wollen, benötigen wir wieder ein Formular mit allen oben angegebenen Feldern; ggf. genügt aber auch eine kleinere Auswahl von Feldern. Zusätzlich können wir zwei zusammengehörende Radiobuttons einbauen, mit denen wir voreinstellen wollen, ob nur eines der eingegebenen Kriterien oder alle zusammen für die Suche gelten sollen (or bzw. and-Suche). Vielleicht können wir auch noch angeben, wie die Suchergebnisse sortiert werden sollen und wieviele Suchergebnisse wir maximal auf einer Seite dargestellt haben wollen.
• Zum Abschicken notwendig sind wieder wie oben Pfad zum Server, Angabe des CGIs (oder ähnlich) und Weiterschicken der eingegebenen Daten.
• Zusätzlich muss aber angegeben werden, dass es sich um eine Suchabfrage handelt, und wie die Suchkriterien verknüpft sind.
• Außerdem wollen wir ja das Suchergebnis zurückerhalten. Ggf. muss dazu ein Webseiten-Templat mit angegeben werden, in welches das cgi nach erfolger Suche die Suchergebnisse einlesen kann. Das Webtemplat kann wiederum aus Formularelementen erstellt werden oder auch nur durch direkten html-Code. Das ganze sollte eine Liste sein, in der die Suchergebnisse z.B. nach Namen aufgelistet werden. auf Klick auf ein Suchergebnis sollen alle Felder aufgerufen werden.

Sie sehen, die Sache wird komplex. Probieren Sie doch mal eine Beispielseite aus, z.B. die Geobiolinks. Dort können Sie ohne Passwort interessante Links eintragen (bitte nur Links zu Geowissenschaften und Biologie/Ökologie) bzw. die Datenbank einfach mal durchsuchen.

Für komplexere, durchsuchbare und editierbare Datenbanken benötigen wir also z.B. folgende Template von Webseiten:

1. Erstellung eines neuen Datensatzes (z.B. new.html)
2. OK-Reaktion auf Neue Erstellung (z.B. new_ok.html)
3. Fehlerreaktion auf Neue Erstellung (z.B. new_error.html)
4. Suchabfrageformular (z.B. search.html)
5. Ergebnis der Suchabfrage als Liste (z.B. search_results.html)
6. Fehlerreaktion auf Suchabfrage (z.B. search_error.html)
7. Detailanzeige der aufgefundenen Datensätze (read only) (z.B. detail_read.html)
8. ggf. editierbare Detailanzeige mit Edit-Knopf und ggf. Löschknopf (z.B. detail_edit.html)
9. OK-Reaktion auf Edit/Löschen (z.B. detail_edit_ok.html)
10. Fehlerreaktion auf Edit/Löschen (z.B. detail_edit_error.html)

Genau so liegt es z.B. für die Geobiolinks vor. Auf den Templaten der Suchergebnis- und Detail-Seiten werden dann die Datenbankdaten automatisch eingelesen. Stellen Sie sich im Templat leere Container vor, die ihre Daten dann von der Datenbank holen und dort einlesen. Umgekehrt machen Sie bei der Erstellung eines neuen Datensatzes, bei Suchabfragen und ggf. in der Editierversion Eingaben in die Container der Template, was dann an die Datenbank abgeschickt wird.

Aus relationalen Datenbanken generierte "on-the-fly"-Webseiten

Deutlich komplexer wird es noch bei relationalen Datenbanken, also bei Datenbanken, bei denen viele zu einer interagierenden Datenbank zusammenarbeiten. Hier können z.B. die Mitarbeiternamen in einer Datenbank sein, die Adressen in einer anderen, die Aufgaben der Mitarbeiter in einer anderen, die Bilder der Mitarbeiter wieder in einer anderen, die wissenschaftlichen Publikationen wieder in einer anderen, die Dienstzimmer in einer weiteren usw. Diese Datenbanken sind vernetzt. Die Mitarbeiter müssen z.B. nur einmal eingegeben werden und sind dann auf den anderen Datenbanken auswählbar. Aus derartig vernetzten Datenbanken können dann Webseiten generiert werden, die eben durch Elemente aus den verschiedensten Datenbanken bedient werden. Das sind dann Webseiten, die "on-the-fly" generiert werden. Ein entsprechendes Beispiel finden Sie als (noch im Aufbau befindliche) Webseiten der Mitarbeiter der Paläontologie München. Literaturzitate wurden z.B. nur einmal in eine entsprechende Datenbank eingegeben. Sind mehrere Autoren beteiligt, werden sie automatisch bei den Seiten aller beteiligten Autoren aufgelistet. (siehe Modul 9.3.2d)

---

Beispiel: online-Erstellen, Durchsuchen und Editieren von Datensätzen einer FilemakerPro-Datenbank.

Wir erstellen nun fiktiv eine kleine Datenbank mit FileMaker-Pro und binden diese ans Web an. Als Beispiel wählen wir eine sehr einfache Gästeliste, in der wir neue Gäste der Paläontologie München eintragen können (im Original mit sehr viel weiteren Optionen versehen, wird im Intranet der Paläontologie München verwendet). Das Ganze soll nachfolgend etwa so aussehen. Wir wollen eine Datenbank mit 9 Feldern erstellen. Entsprechend brauchen wir dann eine Eingabemaske als Formular mit 9 Feldern.

Nachfolgend erläutern wir den vereinfachten html-code für die Seite :

Erstellung der Formular-Eingabefelder. Die Namen für diese Felder müssen mit den Feldnamen in der Datenbankdatei identisch sein.

Zur Vereinfachung habe ich alle anderen Elemente (Text, Abbildungen) unten nicht angegeben, sowie die Tabellenformatierung gelöscht. Es ist nur das reine Formular angegeben (dieses ist aber, wie Sie oben unschwer erkennen, mittels einer zweispaltigen Tabelle formatiert; die Eingabefelder finden sich in der rechten Spalte)

Die eigentlichen Eingabefelder beginnen erst nach den hidden-Feldern. Die wichtigen Namen der neun Eingabefelder habe ich grün unterlegt. Sie müssen mit den Feldnamen in der entsprechenden Datenbank identisch sein (Hinweis: unten habe ich bzw. die verwendete Software teilweise schlampig gearbeitet. Die Attributswerte sollten alle in Gänsefüßchen stehen. Die aktuellen Browser verstehen dies zwar auch ohne, aber zukünftige Generationen sollen hierbei strikter sein; vgl. auch die Anmerkungen zu xhtml im Anhang des Kurses).

Nun zur Erklärung des Anfangsteils des Formulars:

Als Aktion wurde http://www.webservername.de:591/FMPro angegeben. Dies bedeutet, dass ein Webserver angesteuert wird, auf dessen Port 591 der Zugang zu einem ein cgi (bzw. genauer ein Webserverplugin) mit Namen FMPro liegt.

Hinweis: die im nachfolgenden Beispielseiten sind zwischenzeitlich von einem Server mit Port 591 (http://141.84.51.10:591/FMPro) auf einen eigenständigen Server umgezogen, hier der Standard-http-Port 80 verwendet, der nicht extra angegeben werden muss (http://141.84.51..67/FMPro). Dies sei nur erwähnt, um bei den nachfolgenden Beispielen keine Verwirrung zu stiften.

Dieses Webserverplugin FMPro soll irgend etwas machen, was aus dieser Anweisung noch nicht hervorgeht. Da wir aber nun mit der Methode Post verschicken, werden die weiteren Anweisungen innerhalb des Formulars mit den hidden-Input-Feldern geregelt.

Diese haben nicht nur Namen, sondern auch Werte, die nun eben regeln, was das FMPro-Plugin anstellen soll. Es soll nämlich die Datenbank mit Namen Gaesteliste aufrufen, hierbei das Layout Detail verwenden und dahinein eben als neuen Datensatz die entsprechenden Daten packen. Dass überhaupt ein neuer Datensatz erstellt werden soll, wird durch die Übertragung des Namens des Submit-Buttons geregelt, der heißt nämlich -New (siehe ganz unten in Rot), was einen entsprechenden Plugin-Befehl darstellt, der an die Datenbank weitervermittelt wird. Genau derartige Anweisungen bringen auch die Schlüsselwörter -DB, -Lay, -format und -error in den Hidden-Input-Feldern.

Sollte alles geklappt haben, wir die das FMPro-Plugin angewiesen, eine Datei new_reply.htm an die Absendeadresse auszuliefern. Dort drin kann z.B. stehen: "Danke, alles paletti!". Hat es mit dem Anlegen eines neuen Datensatzes nicht geklappt (z.B. weil es keine Datenbank mit entsprechendem Namen gibt oder die entsprechenden Felder nicht vorhanden sind) bekommt das FMPro-Plugin von dem Datenbankprogramm FilemakerPro eine entsprechende Fehlermeldung. Ist dies der Fall, soll es eine html-Datei mit Namen new_error.htm an den Absender zurückschicken, wo gemeldet wird, dass es nicht geklappt hat.

Sehen Sie sich nachfolgenden Code entsprechend genau durch und lesen danach auf der nächsten Seite weiter, wie Sie diese Datenbank, nachdem sie mit mehreren Datensätzen gefüttert ist, wieder abfragen können.

<FORM ACTION="http://www.webservername.de:591/FMPro" METHOD="post">
<P><INPUT TYPE="hidden" NAME="-DB" VALUE="Gaesteliste">
<INPUT TYPE="hidden" NAME="-Lay" VALUE="detail">
<INPUT TYPE="hidden" NAME="-format" VALUE="new_reply.htm">
<INPUT TYPE="hidden" NAME="-error" VALUE="new_error.htm"></P>


<P ALIGN=right><B>Gastdaten</B>:</P>
<P ALIGN=right>Gastvorname:</P>
<P><INPUT TYPE=text NAME=Gastvorname VALUE="" SIZE=30></P>

<P ALIGN=right>Gastnachname:</P>
<P><INPUT TYPE=text NAME=Gastnachname VALUE="" SIZE=30></P>

<P ALIGN=right><B>Adresse</B>:</P>
<P ALIGN=right>Heimatinstitution des Gastes:</P>

<P><INPUT TYPE=text NAME=Institution VALUE="" SIZE=59></P>
<P ALIGN=right>Strasse_Nr:</P>
<P><INPUT TYPE=text NAME="Strasse_Nr" VALUE="" SIZE=59></P>

<P ALIGN=right>Postleitzahl:</P>
<P><INPUT TYPE=text NAME=Postleitzahl VALUE="" SIZE=14></P>

<P ALIGN=right>Ort:</P>
<P><INPUT TYPE=text NAME=Ort VALUE="" SIZE=31></P>

<P ALIGN=right>Land:</P>
<P><INPUT TYPE=text NAME=Land VALUE="" SIZE=30></P>

<P ALIGN=right>ggf. Email</P>
<P><INPUT TYPE=text NAME=Email VALUE="" SIZE=30></P>

<P ALIGN=right>Ankunftstag:</P>
<P><INPUT TYPE=text NAME=Ankunftstag VALUE="" SIZE=30></P>

<p align=center> <INPUT TYPE="submit" NAME="-New" VALUE="Neuen Eintrag abschicken">
<INPUT TYPE=reset VALUE="Zur&uuml;cksetzen"></p>
</FORM>

---

Die Abfrage unserer Datenbank funktioniert folgendermaßen (nächste Seite)

---