Erweiterte dynamische Datenausgabe mit Dreamweaver
zur übergeordneten Seite
 

zum Seitenanfang
Voraussetzungen für diese Lektion
einen Abschnitt zurückeinen Abschnitt weiter
Datenbankanbindung Die hier besprochenen Beispiele beziehen sich auf eine bereits eingebundene erweiterte Tabelle gastbuch der Datenbank schule, die im ersten Teil dieses Kurses (Dynamische Webseiten mit Dreamweaver) erstellt und verwendet wurde (siehe unten).
Darstellung

Für die weiteren Seiten verwenden wir die weiter oben gespeicherte einfache Ausgabeseite und erweitern sie um die Ausgabe aller Datenbankfelder.

Wichtig für das weitere Vorgehen ist, dass sich wirklich eine Bilddatei mit dem von dir angegebenen Namen im gleichen Verzeichnis befindet.

Inhalte des Datensatzes kannst du dir in der Live-Ansicht ansehen.

Füge die in dieser Lektion besprochenen zusätzlichen Ausgaben unter dieser Tabelle ein, dann hast du immer den Vergleich zwischen dem Inhalt des Datensatzes und der entsprechenden Umsetzung auf deiner Seite.

Zur besseren Übersicht solltest du das in Lektion 1 eingefügte Serververhalten Bereich wiederholen wieder abschalten (nach Markieren auf das Minus-Symbol klicken) und nur mit dem ersten bzw. letzten Datensatz arbeiten.

PHP Im Laufe dieses Workshops werden an einigen Stellen des Quelltextes Änderungen vorgenommen. Um diese Ändeungen vorzunehmen brauchst du nicht unbedingt Kenntnisse in PHP. Andererseits kannst du diese Teile des Workshops weglassen und trotzdem eine dynamische Homepage erstellen.

zum Seitenanfang
Bilder dynamisch einfügen
einen Abschnitt zurückeinen Abschnitt weiter
Bildablage Bilder werden nicht direkt in die Datenbank abgelegt, sondern separat mit einem FTP-Programm auf den Server hochgeladen. In der Datenbank wird nur der Dateiname (incl. Dateiendung, jpg oder gif) des Bildes gespeichert.
(Speichere die Bilder immer im gleichen Verzeichnis wie die aufrufende Datei, sonst musst du entweder in der Datenbank den gesamten Zugriffspfad angeben oder im Quelltext der PHP-Seite Modifikationen vornehmen.)
Bilder zum Server Übertrage zunächst die benötigten Bilder in richtiger Größe und entspr. komprimiert auf den Server.
Wähle hierzu die Dateien rechts im Dateifenster aus, verbinde dich per Button mit dem externen Server (den hast du bei der Einrichtung deiner Site bereits angegeben) und klicke nach stehender Verbindung auf den Upload-Button.
Bild einfügen


Füge mit Einfügen - Grafikobjekte- Bildplatzhalter einen Platzhalter für das Bild auf deiner Seite ein. Ziehe aus dem Fenster Bindungen den Feldnamen, der den Dateinamen des Bildes enthält, mit der Maus auf den Bildplatzhalter.
Die Bilddarstellung kann nun nach Anklicken des Bildes im Eigenschaftenfenster weiter modifiziert werden (Ausrichtung, Ränder, Rahmen,...).

Quelltext: Nach Einfügen des Platzhalters steht ein normaler HTML-Befehl ( img src=<...> im Quelltext. Nach Einfügen der Bindung wird der Bilddateiname per echo in das img-TAG eingesetzt.

Da evtl. nicht für jeden Datensatz ein aktuelles Bild zur Verfügung steht, solltest du als Voreinstellung in die Datenbank ein Platzhalterbild (blindgif.gif; 1 x 1 Pixel durchsichtig) einfügen, um entsprechende Fehlermeldungen bzw. unschöne Darstellungen im Browser zu vermeiden.

Workshop Eine praxisorientierte Anleitung hierzu findest du im Workshop Master- und Detail-Seiten (siehe unten).

zum Seitenanfang
Links dynamisch einfügen
einen Abschnitt zurückeinen Abschnitt weiter
externer Link aus der Datenbank

Ziehe aus der Datensatzgruppe(Recordset1) das Feld urltext auf deine Seite. Markiere den erscheinenden Eintrag {Recordset1.urltext} und klicke unten bei Eigenschaften auf das Ordnersymbol rechts neben dem Hyperlinkfeld.

Im erscheinenden Datei-Auswahlfenster wählst du ganz oben: Dateinamen wählen aus: Datenquellen. Klicke dann auf das Feld url und dann auf OK.

Mail-Link

Den Mail-Link werden wir jetzt direkt im Quelltext einsetzen.
Schreibe zunächst einen Hinweis auf deine Seite (z.B.: E-Mail senden), markiere diesen Eintrag und wähle dann Einfügen - E-Mail-Verknüpfung und gib im erscheinenden Fenster als Adresse einfach Dummy ein. Gehe danach in die Quellcode-Ansicht und suche dort den Mail-Link (wenn E-Mail im Entwurf markiert ist, ist auch der entsprechende Quelltext markiert.).
In dem Quelltext <a href="mailto:Dummy">E-Mail senden</a> markierst du per Doppelklick das Wort Dummy und ziehst dann aus dem Fenster Bindungen das Feld email auf die Quelltextmarkierung.
Dummy wird nun ersetzt durch
<a href="mailto:<?php echo $row_Recordset1['email']; ?> ">E-Mail senden</a> .
Diese PHP-Anweisung wird beim Abruf vom Server durch den Inhalt des Feldes email des entsprechenden Datensatzes ersetzt.

Auf diese Weise kannst du an jeder Stelle Inhalte von Datenbankfelder in den Quelltext einfügen.

Link auf neue dynamische Seite

Markiere deinen Link-Text (mehr...) und verlinke ihn unten im Eigenschaftenfenster mit der beabsichtigten PHP-Datei. Klicke auf das Ordnersymbol neben dem Hyperlinkfeld und klicke dann im erscheinenden Dateifenster unten rechts auf Parameter... . Gib in das Namenssfeld CONT_ID ein,klicke dann rechts in den leeren Bereich und dann auf das erscheinende Blitzsymbol und wähle dann das Feld id . Bestätige deine Eingaben mit OK (mehrmals).

 

Bei der aufgerufenen PHP-Seite muss in Datensatzgruppe (Fenster - Bindungen) ein Filter gesetzt werden.
Filter: id = URL-Parameter CONT_ID
Jetzt wird die Seite mit den Daten aus dem Datensatz mit der übergebenen id aufgebaut.

Workshop

Links auf eine neue dynamische Seite brauchst du, wenn du von einer Übersichts- und Auswahlseite auf die jeweils entsprechende Inhaltsseite springen willst, wobei beide Seiten dynamisch aus der Datenbank aufgebaut werden.

Da dies ein ganz zentraler Punkt bei der Gestaltung dynamischer Homepages ist, widmen wir diesem Thema einen eigenen Workshop. (siehe unten)


zum Seitenanfang
formatierte Ausgabe von Datum und Uhrzeit
einen Abschnitt zurückeinen Abschnitt weiter
formatierte Ausgabe SQL und PHP bieten diverse Möglichkeiten, Datum und Uhrzeit zu formatieren. Einige davon lassen sich recht einfach über Dreamweaver nutzen, bei anderen muss kurz im Quelltext der Seite gebastelt werden.
Datumsformate
in SQL

Bei der Ausgabe erscheint das Datum normalerweise in der Form JJJJ-MM-TT - ein Format, das nicht immer ideal geeignet ist. Hier bietet SQL aber Möglichkeiten zur Ausgabe des Datums in seinen einzelnen Komponenten: (zur Erinnerung: datum ist der Name des Datumfeldes in unserer Beispieldatenbank)

  • YEAR(datum) - nur das Jahr (4-stellig)
  • MONTH(datum) - nur den Monat (1-12)
  • DAYOFMONTH(datum) - Tag im Monat (1-31)
  • DAYOFWEEK(datum) - Wochentag (1=Sonntag, 7=Samstag)
  • DATE_FORMAT(datum,form) - Datum gemäß Vorgaben in form (s.u.)

Die letzte Ausgabeform ist am vielseitigsten, da durch die form-Vorgaben sehr leicht die gewünschte Ausgabeform erreicht werden kann. Hierfür sind u.a. folgende Datumsplatzhalter möglich:

  • %d - Tag zweistellig (01-31)
  • %e - Tag einstellig (1-31)
  • %m - Monat zweistellig (01-12)
  • %c - Monat einstellig (1-12)
  • %y - Jahr zweistellig (00, 01, ...)
  • %Y - Jahr vierstellig (2000, 2001, ...)

Beispiel:

  • DATE_FORMAT(datum,"%d.%m.%y") ergibt 06.05.05
  • DATE_FORMAT(datum,"%e-%c-%Y") ergibt 6-5-2005

Es lassen sich auch Wochen- und Monatsnamen ausgeben, aber leider nur auf Englisch. Diese Probleme lassen sich aber durch jeweils einen Vierzeiler in PHP umgehen.

Die vielen weiteren Optionen zur Datumsausgabe findest du in der Literatur oder im Internet in der SQL-Befehlsreferenz.

Datum mit Dreamweaver

Leider hat Dreamweaver mit dem Einbinden des Befehls DATE_FORMAT in den Quelltext ein Problem (falsches Setzen von verschachtelten Anführungszeichen), das sich allerdings von Hand einigermaßen gut lösen lässt.

Zur Übung erstellst du jetzt eine weitere Bindung zur Datenbank, indem du im Fenster Bindungen den Plus-Button klickst und Datensatzgruppe(Abfrage) wählst. Im Fenster wählst du dann Name: Recordset2, Verbindung: schule und Tabelle: gastbuch. Bei Spalten wählst du diesmal nicht alle, sondern ausgewählte und zwar id und datum.

Danach wechselst du mit dem Button rechts im Fenster in die Ansicht Erweitert... . Dort findest du im SQL-Feld den Eintrag:

SELECT id, datum FROM gastbuch

Diesen Eintrag änderst du nun von Hand auf (Groß- und Kleinschreibung streng beachten):

SELECT id, datum, YEAR(datum), MONTH(datum), DAYOFMONTH(datum),
DAYOFWEEK(datum), DATE_FORMAT(datum,'%d.%m.%Y') FROM gastbuch

(wichtig: bei DATE_FORMAT() darf '%d.%m.%Y' nur in einfachen Anführungszeichen stehen!)

Im Fenster Bindungen stehen diese Abfragefelder jetzt genau wie beim ersten Beispiel zur Verfügung. Lediglich das letzte Feld(DATE_FORMAT) neigt dazu, immer wieder verstümmelt zu erscheinen. Klicke dann doppelt auf Datensatzgruppe(Recordset2) und im Fenster dann direkt auf OK. Achtung: Bei verstümmelter Anzeige wird auch nur verstümmelt importiert.

Nachdem du das Feld DATE_FORMAT auf deine Seite gezogen hast, mußt du die einfachen Anführungsstriche um '%d.%m.%Y' durch doppelte Anführungsstriche ersetzen, da Dreamweaver hier einen Fehler produziert hat.
(Hintergrund: In PHP erfüllen einfache und doppelte Anführungszeichen den gleichen Zweck und können ineinander verschachtelt verwendet werden, DW erzeugt hier eine Verschachtelung mit zweimal den gleichen Anführungszeichen, was von PHP dann nicht als Verschachtelung sondern als Befehlsende verstanden wird.)

Wochentag

Du kannst das Datum auch aus den anderen Feldern zusammenbasteln, bei DAYOFWEEK(datum) gibt es aber das Problem, dass nur eine Zahl zwischen 1 und 7 ausgegeben wird - auch dies lässt sich im Quelltext schnell abändern.

Füge in den Quelltext unterhalb der oberen PHP-Befehle, aber noch oberhalb des <html>-Tags die folgenden Zeilen ein:

<?php

function Wochentag($nr=0) {

$wt=array("","Sonntag","Montag","Dienstag","Mittwoch",
"Donnerstag","Freitag","Samstag");
// (in einer Zeile schreiben)

return (substr($wt[$nr],0,2); }

?>

und ersetze weiter unten im Quelltext

<?php echo $row_Recordset2['DAYOFWEEK(datum)']; ?>

durch

<?php echo Wochentag( $row_Recordset2['DAYOFWEEK(datum)'] ); ?>

Jetzt werden von jedem Wochentag die ersten beiden Buchstaben ausgegeben; möchtest du den vollen Namen ausgeben, so ersetzt du oben in der Funktion

return (substr($wt[$nr],0,2) durch return ($wt[$nr])

Uhrzeit
Uhrzeitformate
in SQL

Auch bei der Uhrzeit bietet SQL die Möglichkeit, neben die formatierten Ausgabe HH:MM:SS auch die Stunden, Minuten und Sekunden separat auszulesen:

  • HOUR(uhrzeit) - Stunde (0-23)
  • MINUTE(uhrzeit) - Minute (0-59)
  • SECOND(uhrzeit) - Sekunde (0-59)
  • TIME_FORMAT(uhrzeit,form) - Uhrzeit gemäß Vorgaben in format (s.u.)

Auch für TIME_FORMAT gibt es einige nützliche Vorgaben:

  • %H - Stunden zweistellig (00-23)
  • %k - Stunden einstellig (0-23)
  • %i - Minuten zweistellig (00-59)
  • %s - Sekunden zweistellig (00-59)

Beispiel: TIME_FORMAT(uhrzeit,"%k:%i Uhr") ergibt 9:30 Uhr

Für TIME_FORMAT gilt das für DATE_FORMAT Gesagte ganz entsprechend, auch hier muss der von Dreamweaver erzeugte Fehler von Hand korrigiert werden.

 

 

Uhrzeit mit Dreamweaver

Erstelle eine weitere Bindung zur Datenbank, indem du im Fenster Bindungen den Plus-Button klickst und Datensatzgruppe(Abfrage) wählst. Im Fenster wählst du dann Name: Recordset3, Verbindung: schule und Tabelle: gastbuch. Bei Spalten wählst du diesmal nicht alle, sondern ausgewählte und zwar id und uhrzeit.

Danach wechselst du mit dem Button rechts im Fenster in die Ansicht Erweitert... . Dort findest du im SQL-Feld den Eintrag:

SELECT id, uhrzeit FROM gastbuch

Diesen Eintrag änderst du nun von Hand auf (Groß- und Kleinschreibung streng beachten):

SELECT id, datum, HOUR(uhrzeit), MINUTE(uhrzeit),SECOND(uhrzeit),
TIME_FORMAT(uhrzeit,'%k.%i Uhr') FROM gastbuch

(wichtig: bei TIME_FORMAT() darf  '%k.%i Uhr'  nur in einfachen Anführungszeichen stehen!)

zweistellige Ausgabe erzwingen

Bei der Zeitausgabe über HOUR und MINUTE stört, dass die Ausgabe einstelliger Zahlen ohne führende Null erfolgt. Auch hier läßt sich mit einer kleinen Funktion, die oberhalb des <html>-Tags eingefügt wird, Abhilfe schaffen:

<?php

function zweistellig($s) {

if ( strlen($s) > 2 ) $s=substr($s,strlen($s)-1,2); // nur die beiden letzten Zeichen

if ( strlen($s) == 1 ) $s = "0".$s; // bei Einstelligkeit führende Null einfügen

return ($s) }

?>

Weiter unten im Quelltext muss dann

<?php echo $row_Recordset2['MINUTE(uhrzeit)'] ; ?>

durch

<?php echo zweistellig( $row_Recordset2['MINUTE(uhrzeit)'] ) ; ?>

ersetzt werden. Mit dieser Funktion kann übrigens auch die vierstellige Jahreszahl bei YEAR(datum) auf die letzten beiden Stellen gestutzt werden.

Bei einer echten Anwendung solltest du alle benötigten Felder in einer Abfrage (Recordset1) bündeln, sonst bekommst du evtl. bei den Serververhalten (Z.B. Bereich wiederholen) Probleme.


zum Seitenanfang
5
einen Abschnitt zurückeinen Abschnitt weiter
   
   

zum Seitenanfang
Verwandte Themen
einen Abschnitt zurück
 

 


 
  letzte Aktualisierung:  11.09.2005 13:28


zusammengestellt von Peter Lepke ;    lepke@nils.nibis.de