Der MS Internet Explorer 4.x erlaubt es, in kontrollierter Form Daten aus einer externen Datenquelle zu holen und in HTML-Elementen dynamisch anzuzeigen. So ist beispielsweise eine Tabelle denkbar, in der sich der Anwender bei jedem Klick auf einen entsprechenden Button die Bundesliga-Endtabellen der Spielsaisons von 1960 bis heute anzeigen lassen kann. Bei jedem Klick werden aus einer externen Datei eine Reihe von Daten ausgelesen und dynamisch in die Anzeigetabelle übernommen.
Microsoft hat das Konzept der Datenanbindung sehr flexibel ausgelegt. Es gibt diverse Möglichkeiten, auf externe Datenquellen zuzugreifen. Der Zugriff auf eine einfache Textdatei ist nur eine davon. Es besteht ebenso die Möglichkeit, etwa über die Datenbankabfragesprache SQL auf eine Datenbank zuzugreifen, die SQL-Befehle verarbeiten kann. Für die verschiedenen Möglichkeiten der Datenanbingung gibt es verschiedene Datenmodelle. Für jedes der Datenmodelle gibt es ein bestimmtes ActiveX-Control oder ein Java-Applet, das Sie in Ihrer HTML-Datei ansprechen müssen, um die Datenanbindung damit zu realisieren. Die Datenmodelle und deren Einbindung in HTML werden auf dieser Seite vorgestellt.
Die Vorteile der Datenanbindung liegen auf der Hand: Daten können mit einer dafür geeigneten Anwendung gepflegt und gespeichert werden. Eine HTML-Datei kann auf immer aktuelle Daten zugreifen, ohne selbst geändert werden zu müssen. Für das "Holen" der Daten gibt es kein vorgeschriebenes Protokoll. Die Datenanbindung funktioniert also auf allen Umgebungen, ob auf einem WWW-Server, lokal auf einer PC-Festplatte oder auf einer CD-ROM (zumindest auf das einfachste Datenmodell trifft dies zu). Es ist kein zusätzliches CGI-Script erforderlich, daß als Vermittler zwischen HTML-Datei und Datenbestand für jede Interaktion zwischen Anwender und Datenbank immer wieder aufgerufen werden muß. Das Know How hat der Browser, und die Steuerung der Datenanbindung wird direkt in der HTML-Datei notiert. Durch dynamisches Austauschen der Inhalte von HTML-Elementen, in denen die Daten angezeigt werden, ist kein neuer Aufbau der WWW-Seite erforderlich.
Die Erläuterungen zu den Datenmodellen weiter unten auf dieser Seite sind zum Teil sehr technisch. Das ist leider nicht zu ändern, da die Materie ziemlich komplex ist. Die Erläuterungen zu den Datenmodellen richten sich auch nur an Spezialisten, die wissen, was mit den entsprechenden Begriffen anzufangen ist.
Anzeigebeispiel: So sieht's aus
Die hier beschriebene Vorgehensweise erläutert, wie Sie in einer Tabelle einzelne Datensätze aus einer externen Textdatei anzeigen können. Dabei wird das Datenmodell: Tabular Data Control (TDC) verwendet. Mit Hilfe von Buttons kann der Anwender den nächsten oder vorhergehenden Datensatz in die Tabelle laden.
Name|Vorname|Strasse|PLZ|Ort|Tel|EMail Berger|Hans|Pfisterstr.11|38487|Grubenhausen|04987-4445631|berger@kabumm.de Heidenfroh|Martina|Mittelweg 123|43985|Hatzenau|04583-2398474|mh@heidenfroh.com Rauhbein|Eberhard|Traumstr.13|56097|Höllenbachhausen|068347-582374|- Truthahn|Gerlinde|Aufplatz 1|93722|Sündenstadt|032987-385750|gerlinde@metawelt.net |
Die externe Datei ist in diesem Beispiel eine einfache Textdatei, z.B. eine Datei mit dem Namen daten.txt. Die Datei ist so aufgebaut, daß jede Zeile einen Datensatz darstellt. Die einzelnen Felder eines Datensatzes werden in diesem Beispiel durch das Zeichen "|" getrennt. Es könnte auch ein anderes Zeichen sein. Das Zeichen "|" wurde hier gewählt, weil es sehr selten ist und in den Daten selbst nicht vorkommt. In der ersten Zeile der Datei stehen keine Daten, sondern Feldnamen. Der dritte Feldname lautet beispielsweise Strasse. In den eigentlichen Datenzeilen darunter stehen dann in entsprechender Reihenfolge die Daten. So hat das dritte Feld der ersten Datenzeile den Wert Pfisterstr.11. Dies ist also ein Wert für den in der ersten Zeile an dritter Stelle vergebenen Feldnamen Strasse.
Textdateien dieser Art sind nicht besonders komfortabel, wenn man sie selbst in einem Texteditor bearbeiten will. Doch solche Textdateien lassen sich mit fast allen Tabellenkalkulations- und Datenbankprogrammen erzeugen. Meist ist dafür der Datentyp "kommabegrenzt" ("comma delimited") mit der Standard-Dateiendung .csv vorgesehen. Bessere Programme erlauben es dabei auch, ein selbst definierbares Feldbegrenzerzeichen zu vergeben.
<html> <head> </head> <body> <object id="Adressen" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param name="DataURL" value="daten.txt"> <param name="UseHeader" value="true"> <param name="FieldDelim" value="|"> </object> <form><table id="Anzeigetabelle" datasrc="#Adressen" datapagesize=1 width=100%> <colgroup> <col width=200> <col> <tr> <td bgcolor="#EEEEEE"> </td> <td bgcolor=#EEEEEE align=right> <input type=button value=" < " onclick="document.all.Anzeigetabelle.previousPage();"> <input type=button value=" > " onclick="document.all.Anzeigetabelle.nextPage();"> </td> </tr><tr> <td bgcolor=#EEEEEE valign=top><b>Name:</b></td> <td bgcolor=#FFFFE0 valign=top><span datafld="Name"></span></td> </tr><tr> <td bgcolor=#EEEEEE valign=top><b>Vorname:</b></td> <td bgcolor=#FFFFE0 valign=top><span datafld="Vorname"></span></td> </tr><tr> <td bgcolor=#EEEEEE valign=top><b>Straße:</b></td> <td bgcolor=#FFFFE0 valign=top><span datafld="Strasse"></span></td> </tr><tr> <td bgcolor=#EEEEEE valign=top><b>Postleitzahl:</b></td> <td bgcolor=#FFFFE0 valign=top><span datafld="PLZ"></span></td> </tr><tr> <td bgcolor=#EEEEEE valign=top><b>Wohnort:</b></td> <td bgcolor=#FFFFE0 valign=top><span datafld="Ort"></span></td> </tr><tr> <td bgcolor=#EEEEEE valign=top><b>Telefon:</b></td> <td bgcolor=#FFFFE0 valign=top><span datafld="Tel"></span></td> </tr><tr> <td bgcolor=#EEEEEE valign=top><b>E-Mail:</b></td> <td bgcolor=#FFFFE0 valign=top><span datafld="EMail"></span></td> </tr></table></form> </body> </html> |
Um eine externe Datenquelle in einer HTML-Datei nutzen zu können, müssen Sie zunächst die Quelle und diverse Angaben zu deren Aufbau notieren. Dazu brauchen Sie das <object>-Tag. In dem einleitenden <object>-Tag sind zwei Attribute erforderlich: Mit der Angabe id= vergeben Sie einen Namen, unter dem Sie später auf die Daten zugreifen können. Der Name sollte passend sein, im obigen Beispiel etwa "Adressen". Als zweiten Parameter müssen Sie das ActiveX-Control referenzieren, daß den gesamten Zugriff auf die externe Datei abwickelt. Bei einfachen Textdateien mit zeilenweisen Datensätzen müssen Sie dabei immer die Angabe classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83" notieren. Das ActiveX-Control mit dieser Identifikationsnummer ist im Lieferumfang des MS Internet Explorers ab Version 4.x enthalten - Sie brauchen sich um nichts weiter zu kümmern. Genau dabei liegt allerdings der Knackpunkt des gesamten Konzepts: ohne solche ActiveX-Controls läuft nichts.
Innerhalb des <object>-Tags notieren Sie Angaben zu Ort und Beschaffenheit der externen Datei.
Mit <param name="DataURL" können Sie die gewünschte Datei ansprechen. Hinter value= notieren Sie den Dateinamen. Wenn sich die Datei im gleichen Verzeichnis befindet, genügt der einfache Dateiname. Ansonsten gelten die gleichen Regeln wie bei Verweisen in HTML.
Mit <param name="UseHeader" value="true"> weisen Sie den Browser an, die erste Zeile der externen Datei nicht als Datenzeile zu interpretieren, sondern als Zeile für die Definition der Feldnamen.
Mit <param name="FieldDelim" geben Sie an, welches das Feldtrennzeichen sein soll. Im Beispiel ist dies das Zeichen "|".
Damit sind alle Voraussetzungen geschaffen, um die Daten aus der externen Datei dynamisch in HTML anzuzeigen. Die Anzeige der Daten erfolgt in einer Tabelle. Das einleitende <table>-Tag schafft die nötigen Voraussetzungen, um die Daten in kontrollierter Form anzuzeigen. Zunächst wird in der Tabelle mit id= ein Name vergeben (im Beispiel: Anzeigetabelle). Dieser Name wird bei den Buttons benötigt, die innerhalb der Tabelle das Blättern innerhalb der Datensätze ermöglichen.
Die nächste Angabe im <table>-Tag ist datasrc= (data source, Datenquelle). Damit nehmen Sie Bezug auf die externe Datendatei. An dieser Stelle dürfen Sie jedoch nicht die Datendatei selbst angeben, sondern Sie müssen denjenigen Namen angeben, den Sie zuvor im <object>-Tag bei id= vergeben haben. Und zwar mit einem vorangestellten Gatterzeichen #. Dadurch stellen Sie den Bezug zwischen Tabelle und Datenquelle her. Es werden dann alle Parameter berücksichtigt, die Sie innerhalb des <object>-Tags angegeben haben.
Ebenfalls wichtig ist die Angabe datapagesize= (Datenseitengröße) im <table>-Tag. Damit geben Sie an, wie viele Datensätze aus der externen Datei gleichzeitig angezeigt werden sollen. Wenn Sie diese Angabe weglassen, macht der MS Internet Explorer die Tabelle automatisch so lang, daß alle Datensätze auf einmal darin dargestellt werden. Im obigen Beispiel wird datapagesize=1 angegeben. Dadurch wird immer genau ein Datensatz angezeigt.
Innerhalb der Tabelle können Sie erkennen, wie ein Datensatz aus der externen Datenquelle darin angezeigt wird. Die Tabelle selbst können Sie nach Ihren Wünschen frei gestalten. Wichtig ist nur zu wissen, wie der Bezug zu einem Datensatz der externen Datei hergestellt wird. Im obigen Beispiel geschieht dies innerhalb entsprechender Tabellenzellen mit Hilfe des <span>-Tags. Mit einem, Befehl wie <span datafld="PLZ"></span> weisen Sie den Browser an, in der betreffenden Tabellenzelle den aktuellen Inhalt des Feldes "PLZ" aus der externen Datenquelle anzuzeigen (datafld = data field = Datenfeld). Dabei muß der Wert, den Sie hinter der Angabe datafld= notieren, mit dem Feldnamen übereinstimmen, den Sie in der ersten Zeile der externen Datendatei vergeben haben. Beachten Sie dabei auch die exakte Schreibweise.
Neben der Angabe datafld= können Sie in so einem Datenanzeigebereich auch noch die Angabe dataformatas= (formatiere Daten als) notieren. Im obigen Beispiel wird davon kein Gebrauch gemacht. Benutzen Sie dataformatas=, Wenn die Daten in der externen Datei selbst HTML-Tags enthalten. Mit dataformatas="html" erzwingen Sie dann, daß die Tags aus der externen Datei als HTML-Tags interpretiert werden.
Da im obigen Beispiel mit datapagesize=1 festgelegt wurde, daß immer nur ein Datensatz angezeigt wird, erscheint in der Tabelle zunächst der Inhalt der ersten Datenzeile der externen Datei. Natürlich soll der Anwender nun in den Datensätzen blättern können. Dazu werden Buttons zum Vor- und Zurückblättern definiert. Im Beispiel befinden sich diese Buttons in der ersten Tabellenzeile. Sie könnten aber auch an einer anderen Stelle stehen.
Mit <input type=button value=" < " onclick="document.all.Anzeigetabelle.previousPage();"> wird ein Button definiert, bei dessen Anklicken der vorhergehende Datensatz aufgerufen wird. Mit document.all.Anzeigetabelle greifen Sie dabei auf die Tabelle zu, in der die Daten angezeigt werden (Anzeigetabelle ist dabei der Name, der in der Tabelle mit id= vergeben wurde). Mit <input type=button value=" > " onclick="document.all.Anzeigetabelle.nextPage();"> wird der Button definiert, der zum nächsten Datensatz springt. Beachten Sie, daß Sie nicht kontrollieren müssen, ob der Anwender gerade den ersten oder letzten Datensatz anzeigt. Es gibt keine Fehlermeldungen, wenn der Anwender versucht, einen nicht vorhandenen Datensatz aufzurufen. Der Button hat dann einfach keine Wirkung.
Anzeigebeispiel: So sieht's aus
Das folgende Beispiel setzt auf dem Beispiel: Datei dynamisch in Tabelle einbinden auf. In diesem Beispiel wird gezeigt, wie Sie dem Anwender ermöglichen können, mit Hilfe eines Suchbegriffes nur diejenigen Datensätze anzuzeigen, in denen der gesuchte Begriff vorkommt. Das Beispiel zeigt auch, wie Sie mit Hilfe von Scripts auf die HTML-Elemente zur Datenanbindung zugreifen können.
<html> <head> <script language="JScript"> function Suchen() { var max = 500; document.all.Anzeige.style.display = "none"; var Suchausdruck = ""; var Suchbegriffe = 0; if(document.Eingabe.SuchName.value != "") { if(Suchbegriffe > 0) Suchausdruck = Suchausdruck + " & Name = " + document.Eingabe.SuchName.value; else Suchausdruck = Suchausdruck + "Name = " + document.Eingabe.SuchName.value; Suchbegriffe++; } if(document.Eingabe.SuchVorname.value != "") { if(Suchbegriffe > 0) Suchausdruck = Suchausdruck + " & Vorname = " + document.Eingabe.SuchVorname.value; else Suchausdruck = Suchausdruck + "Vorname = " + document.Eingabe.SuchVorname.value; Suchbegriffe++; } document.all.Adressen.object.Filter = Suchausdruck; document.all.Adressen.Reset(); document.all.Anzeige.dataSrc = "#Adressen"; if(document.all.Adressen.recordset.recordCount < max) { document.all.Anzeige.dataPageSize = Adressen.recordset.recordCount; document.all.Treffer.innerText = Adressen.recordset.recordCount + " Suchtreffer!"; document.all.Anzeige.style.display = "block"; } else document.all.Treffer.innerText = "0 oder zu viele Suchtreffer!"; } </script> </head> <body> <object id="Adressen" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param name="DataURL" value="daten.txt"> <param name="UseHeader" value="true"> <param name="FieldDelim" value="|"> <param name="Filter" value=""> </object> <form name="Eingabe"> Suche nach:<br> <input name="SuchName" type="text" width=40> (Name)<br> <input name="SuchVorname" type="text" width=40> (Vorname)<br> <input type="button" style="width:150px; height:25px;" value="Suche starten" onClick="Suchen()"> </form> <span id="Treffer" style="color:#0000FF; font-weight:bold;"></span> <table width=98%> <tr> <td bgcolor="#EEEEEE" width=14%><b>Name</b></td> <td bgcolor="#EEEEEE" width=14%><b>Vorname</b></td> <td bgcolor="#EEEEEE" width=14%><b>Strasse</b></td> <td bgcolor="#EEEEEE" width=14%><b>PLZ</b></td> <td bgcolor="#EEEEEE" width=14%><b>Ort</b></td> <td bgcolor="#EEEEEE" width=14%><b>Telefon</b></td> <td bgcolor="#EEEEEE" width=14%><b>E-Mail</b></td> </tr> </table> <table id="Anzeige" style="display:none" width=98%> <tr> <td bgcolor="#FFFFE0" width=14%><span datafld="Name"></span></td> <td bgcolor="#FFFFE0" width=14%><span datafld="Vorname"></span></td> <td bgcolor="#FFFFE0" width=14%><span datafld="Strasse"></span></td> <td bgcolor="#FFFFE0" width=14%><span datafld="PLZ"></span></td> <td bgcolor="#FFFFE0" width=14%><span datafld="Ort"></span></td> <td bgcolor="#FFFFE0" width=14%><span datafld="Telefon"></span></td> <td bgcolor="#FFFFE0" width=14%><span datafld="EMail"></span></td> </tr></table> </body> </html> |
Das Beispiel zeigt die vollständige HTML-Datei zur Realisierung einer durchsuchbaren Datenbank. Quelle ist dabei die Textdatei, in der Adressen gesammelt werden. Es handelt sich um die gleiche angenommene Datei wie im Beispiel: Datei dynamisch in Tabelle einbinden. Innerhalb der HTML-Datei wird auch wieder das gleiche <object>-Tag notiert, um die Verbindung zu der externen Datendatei herzustellen. Es wird jedoch ein neuer Parameter angegeben:
<param name="Filter" value="">
Mit dem Parameter Filter können Sie die Datensätze, die aus der Datendatei "geholt" werden, begrenzen. Dazu können Sie bei value= Einschränkungskriterien angeben. Bei der Objektdefinition im obigen Beispiel wird value="" notiert. Das bedeutet, es gibt keine Einschränkungen. Alle Datensätze werden gefunden.
In dem längeren Script, das im Kopf der HTML-Datei steht, wird der Wert für Filter dynamisch verändert. Dadurch wird die Anzeige auf bestimmte Datensätze eingeschränkt, nämlich solche, die den Filterkriterien entsprechen.
Die Kriterien für den Filter soll der Anwender durch seine Suchanfrage selbst bestimmen können. Im obigen Beispiel wird dazu unterhalb des <object>-Tags ein Formular definiert (<form name="Eingabe">). Das Formular hat zwei Eingabefelder, eines zum Angeben eines Namens, und eines zur Eingabe eines Vornamens. Sie könnten an dieser Stelle natürlich auch für alle Felder eines Datensatzes ein Eingabefeld spendieren, im Beispiel etwa für Strasse, PLZ, Ort, Telefon und E-Mail. Die Felder wurden im Beispiel nur der Einfachheit halber weggelassen. Der Anwender kann eines oder auch beide Felder ausfüllen. Mit einem anklickbaren Button kann er die Suche abschicken. Beim Anklicken des Buttons wird die Funktion Suchen() aufgerufen, die in dem JScript-Bereich im Dateikopf definiert ist (onClick="Suchen()").
Innerhalb der Funktion Suchen() wird zunächst eine Variable max mit einem Wert vorbelegt (500). Das empfiehlt sich bei größeren Datenbeständen. Denn per Voreinstellung liefert der MS Internet Explorer, wenn er keine Datensätze findet, die dem Suchkriterium entsprechen, alle Datensätze zurück. Angenommen, Sie haben 5000 Datensätze. Dann würde eine Tabelle mit 5000 Zeilen angezeigt. Da dies im Aufbau unzumutbar lange dauert, ist eine Begrenzung sinnvoll.
Die Variable Suchausdruck soll die Anwenderkriterien zum Durchsuchen des Datenbestandes aufnehmen. Dabei ist es erforderlich, die Angaben aus den Formularfeldern in eine Zeichenkette zu konvertieren, die den Regeln für den Parameter Filter entsprechen.
Folgende wichtige Regeln gelten für Werte, die bei Filter erlaubt sind (diese Regeln gelten sowohl bei Wertzuweisungen innerhalb des <object>-Tags als auch bei dynamischen Wertzuweisungen innerhalb von Scripts):
Mit Feldname = Wert werden nur Datensätze gefunden, bei denen das Feld Feldname exakt den Wert Wert enthält und nicht mehr und nicht weniger. Bei Name = Meyer werden also nur Meyer's gefunden, keine Meyerbohm's.
Mit Feldname <> Wert werden Datensätze gefunden, bei denen der Wert Wert im Feld Feldname vorkommt - er kann auch exakt damit übereinstimmen. Bei Name <> Meyer werden also Meyer's und Meyerbohm's gefunden.
Mit Feldname > Wert werden Datensätze gefunden, bei denen der Wert von Feldname größer ist als Wert. Bei Name > Y werden also nur Namen gefunden, die mit Z anfangen.
Mit Feldname >= Wert werden Datensätze gefunden, bei denen der Wert von Feldname größer oder gleich ist im Vergleich zu Wert. Bei Name >= Y werden also nur Namen gefunden, die mit Y oder Z anfangen.
Mit Feldname < Wert werden Datensätze gefunden, bei denen der Wert von Feldname kleiner ist als Wert. Bei Name < D werden also nur Namen gefunden, die mit A,B oder C anfangen.
Mit Feldname <= Wert werden Datensätze gefunden, bei denen der Wert von Feldname kleiner oder gleich ist im Vergleich zu Wert. Bei Name <= D werden also Namen gefunden, die mit A,B,C oder D anfangen.
An jeder Stelle ist ein Platzhalterzeichen erlaubt. Dies ist ein Sternzeichen (*). Es steht für kein, eines oder beliebig viele Zeichen.
Sie können auch zwei oder mehrere solcher einfachen Ausdrücke mit den Zeichen & (für UND) oder | (für inklusives ODER) logisch verknüpfen. Wenn Sie mehrere Ausdrücke verknüpfen und dabei sowohl UND also auch ODER verwenden, müssen Sie Klammern verwenden, um eine eindeutige Bewertung des gesamten Kriteriums sicherzustellen. Ein komplexer Ausdruck dieser Art ist etwa Name > M & PLZ = 8*.
Im obigen Script wird mit diversen if-Abfragen aus den Eingabefeldern des Formulars ein gültiger Zuweisungswert für Filter konstruiert. Dabei wird nur die einfachste Bedingung mit dem Istgleichzeiten eingesetzt. Da der Anwender auch selbst das Sternzeichen als Platzhalterzeichen in einem Eingabefeld eingeben kann, genügt diese einfache Suche für viele Fälle. Wenn Sie dem Anwender komplexere Suchabfragen ermöglichen wollen, müssen Sie diesen Teil des Scripts entsprechend aufwendiger gestalten.
Im unteren Teil der Funktion Suchen() steht dann der Befehl:
document.all.Adressen.object.Filter = Suchausdruck;
Damit wird dem Parameter Filter des <object>-Tags der Suchausdruck zugewiesen, der zuvor ermittelt und in der Variablen Suchausdruck gespeichert wurde.
Der nächste Befehl ist ebenfalls von entscheidender Bedeutung:
document.all.Adressen.Reset();
Damit veranlassen Sie den Browser, die Anzahl der anzuzeigenden Datensätze neu zu ermitteln. Da mittlerweile ein Filter bestimmt wurde, findet der Browser nun nur noch Datensätze, die den Bedingungen des Filters entsprechen.
Auf die übrigen Anweisungen des Scripts und die Elemente in der HTML-Datei wird hier nicht näher eingegangen. Es handelt sich dabei um einfaches dynamisches HTML nach den Regeln des MS Internet Explorers 4.x.
Im Beispiel: Datei dynamisch in Tabelle einbinden werden die externen Daten jeweils in einem <span>-Tag angezeigt. Es gibt eine Reihe weiterer HTML-Tags, in denen Sie Daten aus Datenfeldern externer Datenquellen anzeigen können. In anderen als diesen Tags ist die Anzeige externer Daten nicht möglich. Folgende HTML-Tags sind erlaubt:
Angenommen, Sie haben eine externe Textdatei verweis.txt mit folgenden Zeilen:
URL,Verweistext
http://www.yahoo.de/,Yahoo Suchdienst
Diese Datei können Sie mit dem <object>-Tag in HTML wie folgt einbinden:
<object id="Verweis" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">
<param name="DataURL" value="verweis.txt">
<param name="UseHeader" value="true">
<param name="FieldDelim" value=",">
</object>
Danach können Sie folgenden Verweis konstruieren:
<a datasrc="#Verweis" datafld="URL"><span datafld="Verweistext"></span></a>
Indem Sie <a datafld=> notieren, wird der Inhalt, den das Datenfeld liefert, als Angabe für href= bewertet (im Beispiel liefert das Feld "URL" diese Angaben). Innerhalb des Verweises wird dann mit Hilfe des <span>-Tags das andere Feld "geholt", nämlich der Verweistext. Solche Verweise machen beispielsweise Sinn, wenn Sie den gleichen Verweis an vielen verschiedenen Stellen auf Ihren WWW-Seiten nutzen. Verweisziel und Verweistext sind dann zentral gespeichert und brauchen bei Änderungen nur in der kleinen Textdatei einmal geändert werden. Alle entsprechenden HTML-Verweise sind damit automatisch aktualisiert.
Angenommen, Sie haben eine externe Textdatei daten.txt mit folgendem Aufbau und Beispieleinträgen:
Zeile,Text
1,Das ist ein Test
2,mit einem Button
3,spannend - was?
Diese Datei können Sie mit dem <object>-Tag in HTML wie folgt einbinden:
<object id="Daten" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">
<param name="DataURL" value="daten.txt">
<param name="UseHeader" value="true">
<param name="FieldDelim" value=",">
</object>
Danach können Sie beispielsweise folgende Tabelle konstruieren:
<table id="Anzeige" datasrc="#Daten" datapagesize=1><tr><td>
<form><button datafld="Text" onClick="document.all.Anzeige.nextPage()"></button></form>
</td></tr></table>
Damit springt der Anwender bei jedem Klick auf den Button einen Datensatz weiter, und die Buttonbeschriftung nimmt den aktuellen Wert des Datenfeldes Text an.
Mit diesem HTML-Tag können Sie beispielsweise innerhalb einer Tabelle externe Daten ausgeben, genau so wie es im Beispiel: Datei dynamisch in Tabelle einbinden mit dem <span>-Tag gemacht wird. Der Unterschied zwischen <div>...</div> und <span>...</span> ist, daß das <div>-Tag einen eigenen Absatz erzeugt, das <span>-Tag dagegen nicht.
Angenommen, Sie wollen eine kleine Diashow programmieren. Dazu können Sie eine Textdatei daten.txt anlegen, die etwa folgenden Aufbau hat:
Nummer,Bild
1,meinhaus.gif
2,meinboot.gif
3,meinauto.gif
4,undich.gif
Diese Datei können Sie mit dem <object>-Tag in HTML wie folgt einbinden:
<object id="Daten" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">
<param name="DataURL" value="daten.txt">
<param name="UseHeader" value="true">
<param name="FieldDelim" value=",">
</object>
Danach können Sie beispielsweise folgende Tabelle konstruieren:
<table id="Anzeige" datasrc="#Daten" datapagesize=1><tr>
<td>
Bild <span datafld="Nummer"></span><br>
<input type=button value=" < "
onclick="document.all.Anzeige.previousPage();">
<input type=button value=" > "
onclick="document.all.Anzeige.nextPage();">
</td><td>
<img datafld="Bild">
</td></tr></table>
Damit kann der Anwender mit den Blätterbuttons die Bilder durchblättern.
Angenommen, Sie haben eine externe Textdatei besteseite.txt mit folgenden Zeilen:
BesteSeite
http://www.teamone.de/selfhtml/
Nun können Sie folgende HTML-Datei mit einem Frameset konstruieren:
<html><head>
<object id="UrlDerWoche" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83">
<param name="DataURL" value="besteseite.txt">
<param name="UseHeader" value="true">
</object></head>
<frameset rows="100,*">
<frame src="meine.htm">
<frame datasrc="#UrlDerWoche" datafld="BesteSeite">
</frameset>
</html>
Auf diese Weise können Sie in einem Frame-Fenster eine Seite anzeigen, deren Zieladresse Sie in der separaten Textdatei pflegen. Wichtig ist, daß Sie das <object>-Tag genau an der Stelle plazieren wie im Beispiel.
Siehe das Beispiel bei Frames. Der Unterschied ist, daß Sie das <object>-Tag in einer normalen HTML-Datei plazieren. Mit einem Befehl wie:
<iframe datasrc="#UrlDerWoche" datafld="BesteSeite"></iframe>
können Sie dann in der gleichen HTML-Datei in einer eingebetteten Fensterbox den Inhalt der Seite anzeigen, die in der Textdatei angegeben ist.
Das <label>-Tag, das neu ist in HTML 4.0, erlaubt die Beschriftung eines Formularfeldes. Im Rahmen der Datenanbindung können Sie dieses HTML-Tag benutzen, wenn Sie die externen Daten in Formularfeldern ausgeben. Sie können dann dem <label>-Tag, das Sie etwa einem Eingabefeld zuordnen, dynamisch den Feldnamen zuweisen, der in der externen Datendatei für dieses Feld definiert ist. Wenn sich der Feldname in der Datendatei dann ändert, wird er bei der Anzeige in der HTML-Datei automatisch aktualisiert. Beispiel:
<label for="Vorname" datafld="prename"></label>
Dadurch wird dem Inhalt des <label>-Tags eines Formularfeldes der Feldname prename zugewiesen, der in der Datenbank definiert ist.
Mit diesem HTML-Tag können Sie beispielsweise innerhalb einer Tabelle externe Daten ausgeben, genau so wie es im Beispiel: Datei dynamisch in Tabelle einbinden mit dem <span>-Tag gemacht wird. Der Unterschied zwischen <marquee>...</marquee> und <span>...</span> ist, daß das <marquee>-Tag einen Lauftext erzeugt, das <span>-Tag dagegen nicht. Das <marquee>-Tag gehört nicht zum HTML-Standard.
Mit diesem HTML-Tag können Sie beispielsweise innerhalb einer Tabelle externe Daten ausgeben, genau so wie es im Beispiel: Datei dynamisch in Tabelle einbinden.
Mit diesem HTML-Tag können Sie beispielsweise innerhalb einer Tabelle externe Daten in editierbaren Formularfeldern ausgeben. Das ist besonders dann interessant, wenn geänderte Daten auch tatsächlich in die Datenquelle zurückgeschrieben werden können. Bei einfachen Textdateien ist das derzeit nicht möglich, wohl aber beim Datenmodell: Remote Data Service (RDS) und beim Datenmodell: JDBC DataSource Applet.
Die Einbindung in HTML erfolgt ähnlich wie im Beispiel: Datei dynamisch in Tabelle einbinden, mit dem Unterschied, daß Sie die Regeln zum Einbinden des gewünschten Datenmodells beachten müssen. Notieren Sie im einleitenden <table>-Tag der Tabelle, in der Sie die Datensätze anzeigen, möglichst die Angabe datapagesize=1. Innerhalb der Tabellenzelle, in der Sie externe Daten auf diese Weise anzeigen wollen, können Sie dann notieren (angenommene Beispiele):
<input type=text datafld="Vorname">
oder:
<input type=radio name="Kunde" value="Bereits Kunde" datafld="BereitsKunde">
oder:
<input type=checkbox name="Zahlweise" value="Mastercard" datafld="Zahlungsweise">
Datenfelder, die in Eingabefeldern vom Typ <input type=text angezeigt werden, können normale Texte sein, wie etwa ein Name. Radiobuttons und Checkboxen stellen dagegen andere Anforderungen. Ein Radiobutton wird bei der Anzeige dann aktiviert, wenn der aktuelle Feldinhalt in der Datenbank mit dem Wert übereinstimmt, der hinter der Angabe value= steht. Eine Checkbox wird dann markiert, wenn der betreffende Feldinhalt in der Datenbank 1, true oder einen beliebigen Inhalt mit mehr als einem Zeichen enthält. Wenn der Inhalt 0, false oder leer ist, wird die Checkbox nicht markiert.
Dabei gelten die gleichen Bedingungen wie bei Formularfeldern vom Typ <input>. Wenn der Wert eines aktuellen Eintrags in der Datenbank mit einem der Werte übereinstimmt, die in der value-Angabe bei einem option-Tag innerhalb der Auswahlliste definiert sind, ist diese Auswahl selektiert. Interessant ist diese Ausgabemöglichkeit von externen Daten wie bei anderen Formularfeldern nur, wenn auch ein Zurückschreiben geänderter Daten möglich ist. Bei Auswahllisten etwa kann ein neuer ausgewählter Wert als neuer Feldinhalt gespeichert werden. Der MS Internet Explorer unterstützt dabei nur die einfache Auswahl, Mehrfachauswahl nicht.
Mit dem <object>-Tag können Sie genau so arbeiten wie mit dem <img>-Tag. Der Unterschied ist, daß Sie beim <img>-Tag auf Grafiken beschränkt sind, während Sie mit dem <object>-Tag beliebige Multimedia-Dateien oder ActiveX-Controls einbinden können. So können Sie, analog zu dem Beispiel beim <img>-Tag, anstelle einer "Dia-Show" eine "Musik-Show" programmieren, die zum Beispiel aus MIDI-Dateien besteht.
In der externen Textdatei notieren Sie die gewünschten MIDI-Dateien, und bei der Einbindung in HTML können Sie dann anstelle der Datenanbindung mit <img> einen Befehl notieren wie:
<object datafld="Musik" width=0 height=0></object>
(wobei "Musik" in der Textdatei mit den Daten als Feldüberschrift notiert sein muß).
Sie können das Feature der Datenanbindung nutzen, um einen Parameter eines Java-Applets aus einer externen Datenquelle zu versorgen. Beispiel:
<applet code="verzerr.class">
<param name="bild" datasrc="#aktuell" datafld="b_gates_bild">
</applet>
Dies ist das Datenmodell, wenn die externe Datenquelle eine einfache Textdatei ist, die in jeder Zeile einen Datensatz enthält, und bei der die einzelnen Datenfelder der Datensätze durch ein Begrenzerzeichen, zum Beispiel ein Komma, markiert sind. Geeignet ist dieses Datenmodell für kleinere Datenbestände mit bis zu ein paar tausend Datensätzen. Ein vollständiges Beispiel dafür finden Sie weiter oben im Abschnitt Beispiel: Datei dynamisch in Tabelle einbinden. Um eine solche Datenquelle an eine HTML-Datei anzubinden, müssen Sie folgendes Objekt in der HTML-Datei notieren:
<object id="Objektname" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param name= value=> <!-- usw. weitere Parameter --> </object> |
Um solche Daten einzubinden, verwenden Sie das im Internet Explorer 4.x eingebaute ActiveX-Control mit der ID 333C7BC4-460F-11D0-BC04-0080C7055A83. Innerhalb des <object>-Tags notieren Sie verschiedene Parameter, die für die Datenpräsentation wichtig sind. Folgende Parameter sind erlaubt:
<param name="AppendData" value=> | Mit diesem Parameter können Sie angeben, ob in der Ausgabetabelle beim Blättern für jedes neue Datensatz-Set (entsprechend der Größe von datapagesize= die vorhandenen Tabellenzellen überschrieben werden sollen, oder ob neue Tabellenzellen angehängt werden sollen. Mit value=true erzwingen Sie das Anhängen von Daten. Per Voreinstellung werden die vorhandenen Tabellenzellen überschrieben. |
<param name="CaseSensitive" value=> | Mit diesem Parameter können Sie angeben, ob bei Vergleichen von Anwendereingaben mit Daten aus der Datenquelle Groß-/Kleinschreibung unterschieden werden soll. Nur interessant bei der Weiterverarbeitung von Daten mit Scripts. Per Voreinstellung wird Groß-/Kleinschreibung unterschieden. Mit value=false können Sie die Fallunterscheidung ausschalten. |
<param name="CharSet" value=> | Mit diesem Parameter können Sie den Zeichensatz angeben, der für die Daten in der Datendatei maßgeblich ist. Per Voreinstellung ist das der Zeichensatz Western Latin-1 (iso-8859-1). Verwenden Sie diesen Parameter nur, wenn die Daten einen anderen Zeichensatz benutzen, z.B. iso-8859-5 für Kyrillisch. Bei value= können Sie den Zeichensatz angeben. Nähere Informationen im Abschnitt über Zeichensätze. |
<param name="DataURL" value=> | Dieser Parameter ist unbedingt erforderlich. Bei value= geben Sie die Datei an, in der sich die Daten befinden. |
<param name="EscapeChar" value=> | Diesen Parameter sollten Sie angeben, wenn in Ihrer Datendatei ein Zeichen als Maskierungszeichen verwendet wird. Das ist z.B. der Fall, wenn Sie in einer kommabegrenzten Datei Kommata innerhalb von Feldern mit einem vorangestellten Backslash \ maskieren. Geben Sie in diesem Fall bei value= das Maskierungszeichen an. |
<param name="FieldDelim" value=> | Mit diesem Parameter geben Sie an, welches Zeichen als Trennzeichen für Datenfelder innerhalb einer Zeile der externen Textdatei interpretiert werden soll. Bei value= können Sie das Zeichen angeben. |
<param name="Filter" value=> | Mit diesem Parameter können Sie die Datenauswahl einschränken. Per Voreinstellung werden alle Daten aus der externen Datei angezeigt. Interessant ist dieser Parameter vor allem, wenn der Anwender in einem Eingabeformular die Suche selbst definieren kann, und die Eingaben dann mit Hilfe eines Scripts dynamisch diesem Parameter des <object>-Tags zugewiesen werden. Bei value= können Sie den Filter angeben. Beispiele: value="Telefon <> '089*'" findet in einem Feld "Telefon" nur Nummern, die mit 089 beginnen. value="PLZ > '50000'" findet in einem Feld "PLZ" für Postleitzahlen nur Werte, die größer als 50000 sind. |
<param name="Language" value=> | Mit diesem Parameter können Sie die Sprache angeben, in der die Daten der exterenen Datendatei vorliegen. Maßgeblich sind dafür die Sprachennamen, wie sie in ISO 369 definiert sind. Bei value= können Sie die Sprache angeben. |
<param name="RowDelim" value=> | Wenn Ihre externe Datendatei so aufgebaut ist, daß am Ende eines Datensatzes ein Datensatzbegrenzerzeichen steht, müssen Sie dieses Zeichen mit diesem Parameter angeben. Notieren Sie hinter value= das Zeichen. |
<param name="Sort" value=> | Mit diesem Parameter können Sie veranlassen, daß bei gleichzeitiger Ausgabe mehrerer Datensätze (also bei datapagesize= größer 1) die angezeigten Datensätze nach einem bestimmten Feld sortiert werden. Beispiele: value="PLZ" sortiert auszugebende Daten nach einem Feld namens "PLZ". value="-PLZ" sortiert auszugebende Daten nach einem Feld namens "PLZ", und zwar absteigend (Minuszeichen davor). value="Name; PLZ" sortiert auszugebende Daten erstens nach Name und zweitens nach Postleitzahlen. |
<param name="TextQualifier" value=> | Wenn Ihre externe Datendatei so aufgebaut ist, daß alle Datenfelder in bestimmte Zeichen eingeschlossen sind, zum Beispiel in Anführungszeichen, dann sollten Sie mit diesem Parameter das betreffende Zeichen angeben. Mit value="'"'" etwa bestimmen Sie das Anführungszeichen als Zeichen für Feldanfang und Feldende. |
<param name="UseHeader" value=> | Diesen Parameter müssen Sie dann angeben, wenn die erste Zeile der externen Datendatei keine Daten enthält, sondern die zugehörigen Feldnamen. Mit value=true wird die Datendatei so interpretiert, daß die erste Zeile Feldnamen enthält. Mit value=false wird sie so interpretiert, daß gleich in der ersten Zeile die Daten beginnen. |
Über das Datenmodell Remote Data Service (RDS) können Sie die Anbindung einer HTML-Datei an Daten aus einer Datenbank realisieren. Geeignet ist dieses Modell für Datenbanken, die über die Datenbank-Schnittstellen OLE-DB oder ODBC (DBMS) verfügen. Das sind beispielsweise MS Access, Oracle oder SQL-Server wie msql. Über die entsprechenden Produkte und den Aufbau von Datenbanken damit informieren Sie sich bitte bei den betreffenden Herstellern. Um eine solche Datenanbindung im WWW zu realisieren, muß die Datenbankanwendung auf dem Server-Rechner installiert sein. Fragen Sie dazu gegebenenfalls Ihren Provider.
Um eine solche Datenquelle an eine HTML-Datei anzubinden, müssen Sie folgendes Objekt in der HTML-Datei notieren:
<object id="Objektname" classid="clsid:BD96C556-65A3-11D0-983A-00C04FC29E33"> <param name= value=> <!-- usw. weitere Parameter --> </object> |
Um solche Daten einzubinden, verwenden Sie das im Internet Explorer 4.x eingebaute ActiveX-Control mit der ID BD96C556-65A3-11D0-983A-00C04FC29E33. Innerhalb des <object>-Tags notieren Sie verschiedene Parameter, die für die Datenpräsentation wichtig sind. folgende Parameter sind möglich:
<param name="Server" value=> | Mit diesem Parameter müssen Sie die Datei angeben, die die Datenbank ausführt. Das kann auf Windows-Rechnern eine EXE-Datei sein oder auf Unix-Rechnern auch ein Link zu einer ausführbaren Datei. Bei value= können Sie den Namen angeben. Dabei sind natürlich relative Pfadangaben aus Sicht der HTML-Datei oder auch absolute URL-Adressen vom Typ http://... erlaubt. |
<param name="Connect" value=> | Mit diesem Parameter müssen Sie eine Zeichenkette übergeben, die eine ODBC-Verbindung zu der Datenbank aufbaut. Die Zeichenkette muß dem ODBC-Standard entsprechen. Informationen dazu entnehmen Sie der Dokumentation zu der Datenbank. Bei value= geben Sie die Zeichenkette an, zum Beispiel value="dsn=Adressen;uid=guest;pwd=" |
<param name="SQL" value=> | Mit diesem Parameter müssen Sie einen Befehl angeben, den Sie zum Ansprechen der Datenbank absetzen wollen. Dies kann ein beliebiger gültiger SQL-Befehl sein. SQL (Structured Query Language) ist eine standardisierte Datenbankabfragesprache. Diese Sprache und ihre Befehle müssen Sie kennen, um den Parameter mit korrekten Werten zu versorgen. |
Solche Datenanbindungen sind nur sinnvoll, wenn Sie dem Anwender ein HTML-Formular zur Verfügung stellen, in dem er seine Angaben zum Durchsuchen der Datenbank machen kann. Mit Hilfe eines JavaScripts können Sie dann die Anwendereingaben in einen gültigen SQL-Befehl umwandeln, den Sie im Script dem Parameter SQL des object-Tags zuweisen. So können Sie beispielsweise mit der JavaScript-Anweisung:
document.all.Datenbank.SQL = Abfrage;
eine SQL-Abfrage zuordnen. In diesem Beispiel ist "Datenbank" der Name, der beim object-Tag als id= vergeben wird, und Abfrage ist eine Variable, die zuvor aus Formulareingaben des Anwenders einen SQL-Befehl kreiert hat. Bei solchen Datenbanken ist es auch möglich, SQL-Befehle zum Schreiben von geänderten Datensätzen in die Datenbank zurückzuschreiben. Voraussetzung ist, daß die Daten in der HTML-Datei in editierbaren HTML-Eingabefeldern (z.B. <input...>) angezeigt werden.
Ausführliche Informationen zum Einrichten und Realisieren einer Datenbank mit Scritps finden Sie innerhalb des Microsoft Internet Client SDK (Dokumentation aller Microsoft Internet Technologien).
Das Datenmodell JDBC DataSource Applet greift ebenso wie das Datenmodell Remote Data Service (RDS) auf Datenbanken zu, die über die Datenbank-Schnittstellen OLE-DB oder ODBC (DBMS) verfügen, zum Beispiel MS Access, Oracle oder SQL-Server wie msql. Der Unterschied zwischen dem JDBC DataSource Applet und dem Remote Data Service (RDS) ist, daß letzterer in der HTML-Datei als ActiveX-Control eingebunden wird, während das JDBC DataSource Applet ein Java-Applet ist. Damit will Microsoft seine Datenanbindungs-Technologie anderen Browsern zur Verfügung stellen, die kein ActiveX unterstützen, wohl aber Java. Das tun zwar Netscape und einige andere Browser, doch solange diese das Konzept der Datenanbindung mit Dynamischem HTML nicht unterstützen, macht das Ganze eigentlich wenig Sinn.
Das Java-Applet, das diese Form der Datenanbindung steuert, gehört nicht zum Lieferumfang des MS Internet Explorers. Auf den WWW-Seiten von Microsoft können Sie das JDBC DataSource Java-Applet downloaden.
Um eine solche Datenanbindung im WWW zu realisieren, muß die Datenbankanwendung auf dem Server-Rechner installiert sein. Fragen Sie dazu gegebenenfalls Ihren Provider.
Um eine solche Datenquelle an eine HTML-Datei anzubinden, müssen Sie das JDBC DataSource Java-Applet in der HTML-Datei notieren.
<applet code="JDC.class" name="DSA1" id="DSA1" width=0 height=0> <param name= value=> <!-- usw. weitere Parameter --> </applet> |
Das Java-Applet wird wie in HTML üblich mit dem <applet>-Tag eingebunden. Mit dem Attribut code= geben Sie die ausführbare Java-Datei an. Dies ist die Datei JDC.class, die Sie mit dem Download des JDBC DataSource Java-Applets erhalten. Innerhalb des Applets notieren Sie verschiedene Parameter, die das Applet benötigt, um korrekt zu arbeiten. Weiterführende Infos zu den Parametern entnehmen Sie der Original-Dokumentation zu dem Applet. Folgende Parameter erwartet das Applet:
<param name="cabbase" value=> | Mit diesem Parameter geben Sie die Datei an, in der der Quellcode des Applets steht. Es handelt sich um eine CAB-Datei. Relative Pfadnamen oder auch absolute URL-Adressen sind dabei erlaubt. |
<param name="dbURL" value=> | Mit diesem Parameter geben Sie bei value= die Datei an, in der die Datenbank gespeichert ist. Relative Pfadnamen oder auch absolute URL-Adressen sind dabei erlaubt. |
<param name="showUI" value=> | Mit diesem Parameter geben Sie an, ob das Applet innerhalb der HTML-Datei seine eigene Benutzeroberfläche anzeigen soll oder nicht. Mit value=true wird das Applet angezeigt, mit value=false nicht. Der Parameter ist optional. |
<param name="sqlStatement" value=> | Mit diesem Parameter müssen Sie einen Befehl angeben, den Sie zum Ansprechen der Datenbank absetzen wollen. Dies kann ein beliebiger gültiger SQL-Befehl sein. SQL (Structured Query Language) ist eine standardisierte Datenbankabfragesprache. Diese Sprache und ihre Befehle müssen Sie kennen, um den Parameter mit korrekten Werten zu versorgen. |
<param name="allowInsert" value=> | Mit diesem Parameter geben Sie an, ob der Anwender Datensätze durch Ausfüllen entsprechender Eingabefelder neue Datensätze in die Datenbank schreiben darf. Mit value=true erlauben Sie das Hinzufügen von Daten, mit value=false verbieten sie es. |
<param name="allowDelete" value=> | Mit diesem Parameter geben Sie an, ob der Anwender angezeigte Datensätze mit Hilfe entsprechender Befehlsbuttons aus der Datenbank löschen darf. Mit value=true erlauben Sie das Löschen von Daten, mit value=false verbieten sie es. |
<param name="allowUpdate" value=> | Mit diesem Parameter geben Sie an, ob der Anwender angezeigte Datensätze in entsprechenden Eingabefeldern editieren und geänderte Daten mit Hilfe entsprechender Befehlsbuttons in die Datenbank zurückschreiben darf. Mit value=true erlauben Sie das Ändern von Daten, mit value=false verbieten sie es. |
<param name="user" value=> | Mit diesem Parameter können Sie der Datenbank bei value= den Namen eines angemeldeten Users übergeben, sofern die Datenbank dies verlangt. Der Parameter ist optional. |
<param name="password" value=> | Mit diesem Parameter können Sie der Datenbank bei value= das Passwort des Users übergeben, sofern die Datenbank dies verlangt. Der Parameter ist optional. |
Beim Datenmodell JDBC DataSource Applet gelten die Anmerkungen zum Datenmodell Remote Data Service (RDS).
Das Datenmodell XML Data Source könnte in Zukunft sehr interessant werden, da es die vom W3-Konsortium standardisierte Sprache XML zur Definition von Daten benutzt. Bei diesem Datenmodell werden die Daten in einer XML-Datei gespeichert. Für Datensätze und Datenfelder können Sie innerhalb der XML-Datei eigene Tags und deren Verschachtelung erfinden. Ein denkbares Schema für eine Adressendatei wäre etwa:
<adresse>
<name>Meyer</name>
<vorname>Hubert</vorname>
<ort>Hamburg</ort>
<telefon>040-598487374</telefon>
</adresse>
Die Datei muß den Konventionen zum Aufbau einer XML-Datei entsprechen. Lesen Sie dazu die XML-Spezifikation des W3-Konsortiums. Eine sehr ordentliche deutschsprachige Einführung in XML stammt von Kuno Dünhölter.
Im Lieferumfang des MS Internet Explorers 4.x ist ein Java-Applet enthalten, das solche Tag-Strukturen aus XML-Dateien interpretiert und die Datenstruktur daraus ermittelt.
Um diese Art von Datenquelle an eine HTML-Datei anzubinden, müssen Sie das zugehörige Java-Applet in der HTML-Datei notieren.
<applet class=com.ms.xml.dso.xmldso.class id="xmldso" width=0 height=0 mayscript=true> <param name="url" value=> </applet> |
Das Java-Applet wird wie in HTML üblich mit dem <applet>-Tag eingebunden. Notieren Sie das einleitende <applet>-Tag genau so wie im obigen Schema. Der Grund für die etwas ungewöhnliche Angabe bei class= ist, daß dieses Java-Applet eine interne Ressource des MS Internet Explorers ist und keine separat vorliegende Datei.
Das Applet erwartet genau einen Parameter:
Mit <param name="url" value=> geben Sie bei value= den Dateinamen der XML-Datei an. Dabei sind natürlich auch relative Pfadangaben oder absolute URL-Adressen erlaubt.
Was Sie mit XML besonders elegant lösen können, geht etwas weniger elegant auch mit HTML selbst: hinter dem Datenmodell MSHTML Data Source verbirgt sich nichts anderes als eine Konvention, nach der die Daten in einer HTML-Datei gehalten werden - diese HTML-Datei dient dann als externe Quelle für eine andere HTML-Datei, in der die Daten angezeigt werden. Ein Schema für den Datensatz einer Adressendatei wäre etwa:
<div id="Adresse">
<span id="Name">Meyer</span><br>
<span id="Vorname">Hubert</span><br>
<span id="Ort">Hamburg</span><br>
<span id="Telefon">040-598487374</span><br>
</div>
Um diese Art von Datenquelle an eine HTML-Datei anzubinden, müssen Sie ein einfaches Objekt dafür notieren.
<object id="Daten" data="daten.htm" width=0 height=0> </object> |
Innerhalb des <object>-Tags vergeben Sie mit id= wie üblich einen Namen, unter dem Sie das Objekt ansprechen und die Daten aus der anderen Datei in einer Tabelle dynamisch anzeigen können. Das Zugreifen auf die Datensätze funktioniert dabei genau so wie im Beispiel: Datei dynamisch in Tabelle einbinden. Bei datafld= geben Sie den Namen an, den Sie in der externen HTML-Datei bei id= für jedes gleiche Feld eines Datensatzes vergeben haben, z.B. "Vorname".
weiter: | Dynamische Filter (Microsoft) |
zurück: | Dynamischer Zugriff auf HTML-Elemente (Microsoft) |