nicht angemeldet
Hallo Luna,
bist Du noch bei deinem Info-Broadcast-Projekt?
Was benötigt so ein Konstruktor alles und wie kann ich dem angeben, er soll externe Daten aus einer anderen Datei als HTML anzeigen lassen?
Der Konstruktor liest keine Daten ein, aber:
Mit JavaScript kann man sehr viel machen und beliebig Daten verarbeiten. Eine sehr schöne Möglichkeit sind sog. assoziative Arrays, für die ein Konstruktor benötigt wird.
Ein Konstruktor:
var p = new Array(); // Projektmitglieder
function Mitglied(aufgabe, firma, abt, bereich, name, telefon, fax, email, strasse, ort)
{
this.aufgabe = aufgabe;
this.firma = firma;
this.abt = abt;
this.bereich = bereich;
this.name = name;
this.telefon = telefon;
this.fax = fax;
this.email = email;
this.strasse = strasse;
this.ort = ort;
}
gespeichert in einer Datei z.B. Mitgliedf.js
Dazu passend eine gut strukturierte Datei, über die leicht die dazugehörigen Daten in einem Editor erfasst werden können:
p[p.length] = new Mitglied();
p[p.length-1].aufgabe = 'Projektleitung';
p[p.length-1].firma = 'Berati GmbH';
p[p.length-1].abt = 'Geschäftsleitung';
p[p.length-1].bereich = '';
p[p.length-1].name = 'Frau Berta Berati';
p[p.length-1].telefon = '';
p[p.length-1].fax = '';
p[p.length-1].email = 'Berta.Berati@berati.com';
p[p.length-1].strasse = 'Scriptallee 1';
p[p.length-1].ort = '12345 Scripting';
p[p.length] = new Mitglied();
p[p.length-1].aufgabe = 'Program Managerin';
p[p.length-1].firma = 'Berati GmbH';
p[p.length-1].abt = 'Abteilung Rechenzentrum';
p[p.length-1].bereich = '';
p[p.length-1].name = 'Frau Hanni Hacker';
p[p.length-1].telefon = '';
p[p.length-1].fax = '';
p[p.length-1].email = '';
p[p.length-1].strasse = 'Scriptallee 1';
p[p.length-1].ort = '12345 Scripting';
Gespeichert z.B. in einer Datei Mitgliedd.js
Ein Script in der folgenden Form sollte in etwa Deine HTML-Datei beinhalten:
<script language=JavaScript src=mitgliedf.js></script>
<script language=JavaScript src=mitgliedd.js></script>
<script language=JavaScript>
var anzPersonen = p.length;
var PersonText = ' ';
function Personen()
{
PersonText += '<div ID="layer999">\n<center>\n<h1>' + a[0].name + '\n</h1>\n</center>\n</div>';
PersonText += '\n<div ID="layer998">'
+ '\n<table>'
+ '\n<tr>\n<td width="30%" align="right" valign="top">\n<a>Info zu Person :\n</a>\n</td>\n<td width="70%" align="left" valign="top">\n<a>Bewegen Sie die Maus auf einen der angezeigten Namen. Es werden dann alle verfügbaren Informationen zu dieser Person angezeigt.\n</a>\n<HR>\n</td>\n</tr>'
+ '\n<tr>\n<td width="30%" align="right" valign="top">\n<a>Mail an eine Person :\n</a>\n</td>\n<td width="70%" align="left" valign="top">\n<a>Klicken Sie mit der Maus auf den Namen der Person oder auf eine angezeigte eMail-Adresse. Es wird automatisch eine Mail erzeugt.\n</a>\n<HR>\n</td>\n</tr>'
+ '\n<tr>\n<td width="30%" align="right" valign="top">\n<a>DatenPflege : \n</a>\n</td>\n<td width="70%" align="left" valign="top">\n<a>Klicken Sie am Ende der Liste aller Projektmitglieder auf den Eintrag "Daten pflegen". Es wird dann die Funktion zum Bearbeiten der Projektdaten aufgerufen. Speichern Sie Ihre Änderungen und kehren Sie zu dieser Seite zurück. Ihre Änderungen werden angezeigt, wenn Sie aus der Menüleiste die Funktion "aktualisieren" anklicken.\n</a>\n<HR>\n</td>\n</tr>'
+ '\n</table>\n</div>';
for ( var i=0;i < anzPersonen; i++)
{
PersonText += '\n<div ID="layer' + i + '">\n<table>\n\n<tr>\n<td width="50%" align="right" valign="TOP">\n<BR>\n<B>';
if (p[i].aufgabe) PersonText += p[i].aufgabe + '\n</B>\n</td>';
else PersonText += 'Aufgabe nicht definiert' + '\n</B>\n</td>';
PersonText += '\n<td width="50%">\n<BR>\n<B>';
if (p[i].name) PersonText += p[i].name + '\n<BR>\n</B>';
if (p[i].firma) PersonText += p[i].firma + '\n<BR>';
if (p[i].abt) PersonText += p[i].abt + '\n<BR>';
if (p[i].bereich) PersonText += p[i].bereich + '\n<BR>';
if (p[i].strasse) PersonText += p[i].strasse + '\n<BR>';
if (p[i].ort) PersonText += p[i].ort + '\n<BR>';
if (p[i].telefon) PersonText += 'Tel.: ' + p[i].telefon + '\n<BR>';
if (p[i].fax) PersonText += 'Fax: ' + p[i].fax + '\n<BR>';
if (p[i].email) PersonText += '\n<a href="mailto:' + p[i].email + '">' + 'eMail: ' + p[i].email + '\n</a>\n<BR>';
PersonText += '\n</td>\n</tr>\n</table>\n</div>';
}
return (PersonText);
}
/*
Jetzt wird das zu erstellende Dokument zusammengesetzt und ausgegeben
*/
var ProjektDok = Kopf();
ProjektDok += DivAuswahl();
ProjektDok += DivMenu();
ProjektDok += Personen();
ProjektDok += Fuss();
if (d[0].test == 'ja')
{
test = window.open('testip','testip');
test.document.open ('text/html');
test.document.write(ProjektDok);
test.document.close();
}
else
{
document.open ('text/html');
document.write(ProjektDok);
document.close();
}
</script>
Auf die Art und Weise lassen sich flexibel verschiedenste Daten, die extern gespeichert sind in HTML-Seiten verarbeiten.
Die Lösung ist zu dem vielseitig erweiterbar und erlaubt die totale externalisierung aller Seitenstrukturen, um Layout, Design extern zu definieren und dann daraus die gewünschten Seiten zu erzeugen.
Hoffe, nicht zu komplex geworden zu sein.
Gruß
Günter
P.S. Der Einbau einer Testfunktion ist sehr empfehlenswert, da diese Lösung gleichzeitig den Quellcode der Seite total versteckt. Der ist nur sichtbar, wenn der erzeugte Text in einem neuen Fenster ausgegeben wird. Ansonsten sieht man nur solch kryptischen Text wie in der function Personen()