Wie man<AppML> verwendet
Dieses Kapitel zeigt, wie Sie in 4 einfachen Schritten eine <AppML>-Anwendung erstellen.
Das nächste Kapitel stellt vor, wie Sie <AppML> herunterladen und mit der Entwicklung von Webanwendungen auf Ihrem eigenen Computer beginnen.
1. Ein Modell erstellen
Erstellen Sie eine Datei mit folgendem Inhalt:
<datasource>
<database>
<connection>Demo</connection>
<sql>SELECT CustomerName,ContactName,City,Country FROM Customers</sql>
<orderby>CustomerName</orderby>
</database>
</datasource>
<filters>
<query>
<field>CustomerName</field>
</query>
</filters>
</appml>
Speichern Sie die Datei im Unterverzeichnis Models (wird empfohlen) unter dem Namen Customers.xml.
Modellanalyse
Das <appml>-Tag definiert das Modell.
Das <datasource>-Tag definiert die Datenquelle des Modells.
Das <database>-Tag definiert die Datenbank.
Der <connection>-Tag definiert die Verbindung zur Datenbank.
Der <sql>-Tag definiert die Datenabfrage.
Der <orderby>-Tag definiert die Standardsortierung.
Der <query>-Tag definiert gültige Abfragefilter.
2. Erstellen Sie eine Webpage
Erstellen Sie in Ihrer ersten <AppML>-Anwendung eine HTML-Seite:
Beispiel
<html>
<body>
<h1>Meine erste Webanwendung</h1>
<table>
<tr>
<th>Kunde</th>
<th>Stadt</th>
<th>Land</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Berlin</td>
<td>Deutschland</td>
</tr>
</table>
</body>
</html>
Selbst ausprobieren »
3. Styles hinzufügen
Fügen Sie Stylesheets zu Ihrer Webpage hinzu und führen Sie dann die <AppML>-Anwendung aus:
Beispiel
<html>
<head>
<link rel="stylesheet" href="appml.css.html">
</head>
<body>
<h1>Meine erste Webanwendung</h1>
<table class="appmltable">
<tr>
<th>Kunde</th>
<th>Stadt</th>
<th>Land</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Berlin</td>
<td>Deutschland</td>
</tr>
</table>
</body>
</html>
Selbst ausprobieren »
4. Scripts hinzufügen, dann die Anwendung ausführen
Fügen Sie Scripts zu Ihrer Webpage hinzu, um die <AppML>-Anwendung auszuführen:
Beispiel
<html>
<head>
<link rel="stylesheet" href="appml.css.html">
</head>
<body>
<h1>Meine erste Webanwendung</h1>
<div id="Place01">
<table id="Template01" class="appmltable">
<tr>
<th>Kunde</th>
<th>Stadt</th>
<th>Land</th>
</tr>
<tr id="appml_row">
<td>#CustomerName#</td>
<td>#City#</td>
<td>#Country#</td>
</tr>
</table>
</div>
<script src="appml.js.html"></script>
<script>
app=new AppML("appml.htmlx","Models/Customers.xml");
app.run("Place01","Template01");
</script>
</body>
</html>
Selbst ausprobieren »
Beispielanalyse
Die <AppML>-Bibliothek enthält eine große Anzahl von Funktionen. Diese Funktionen können in Ihren Webpages aufgerufen werden.
<script src="appml.js.html">Die <AppML>-Bibliothek wird geladen.
JavaScript-Anweisung:app=new AppML("appml.htmlx","Models/Customers.xml");Erstellt ein AppML-Anwendungsobjekt und führt dann das Webserver-Script "appml.htmlx" aus, um die Daten aus der Datei "Customers.xml" zu laden.
JavaScript-Anweisung:app.run("Place01","Template01");Fügt die Daten in das HTML-Element mit id="Place01" ein und verwendet dabei das Element mit id="Template01" als Vorlage.
Attributeid="appml_row"Definiert, wie jeder Datensatz in das HTML-Element eingefügt wird.
Die Daten in den #-Markierungen werden durch die Daten des Modells ersetzt.
Können Sie sich bei all dem einen schnelleren Prototypen vorstellen?
Wie funktioniert es?
- Wenn eine Webpage geladen wird, können Sie den <AppML>-Controller in der Seite laden.
- Mit dem <AppML>-Controller können Sie <AppML>-Objekte in der Seite erstellen.
- Wenn Sie das <AppML>-Objekt auf der Seite ausführen, fordert es den serverseitigen Datencontroller an.
- Das <AppML>-Objekt empfängt Daten vom Server (unter Verwendung des Datenmodells).
- Das <AppML>-Objekt (oder Ihr Code) zeigt die Daten auf der Seite an.
- (Optional) Webbenutzer können die Daten ändern.
- (Optional) <AppML> kann Daten im Hintergrund an den Server senden.
- (Optional) Der Server-Controller kann Daten auf der Servergegenseite speichern.
Typische Webdateien und -ordner:
|
|
Daten-Ordner:Data Bilderordner:Images Modellordner: Models Anwendung:Demo.htm Stile:Demo.css
<AppML>-Konfigurationsdatei:appml_config.php (oder .htmlx) <AppML>-Stildatei:appml.css <AppML>-Browser-Controller:appml.js <AppML>-Server-Controller:appml.php (oder .htmlx) |
Keine Einschränkungen
Sie können das <AppML>-Objekt in der HTML-Seite platzieren. <AppML> beeinträchtigt andere Teile der Seite nicht.
Wenn die Schemaseite nicht existiert, verwendet <AppML> standardmäßig die Standardanzeigeseite. Dies ist perfekt für die schnelle Prototypenerstellung.
Die Hauptfunktion von <AppML> ist jedoch nicht die Seitenanzeige. <AppML> dient hauptsächlich dem Lesen von Anwendungsdaten. Die bereitgestellten Daten können für die Anzeige mit HTML, CSS und JavaScript frei gestaltet werden. Sie können:
- Ihr eigenes HTML schreiben und AppML die Daten verarbeiten lassen.
- Das Modell aufrufen und die gesamte Anzeige verarbeiten.
- Verwenden Sie die Eigenschaften und Methoden von AppML, um andere Kombinationen zu erstellen.
Sie werden bald entdecken, dass <AppML> über leistungsstarke Funktionen verfügt und Daten sowie Datenmodelle für Ihre Webanwendungen bereitstellt. Sie können:
- Datensicherheit für Benutzer oder Benutzergruppen definieren
- Verbindung zu allen Arten von Datenbanken herstellen, wie Access, MySQL, SQL und Oracle
- XML-Dateien und Textdateien anbinden
- Datentypen, Datenformate und Datenbeschränkungen definieren
- Beliebige neue Elemente zum Modell hinzufügen