Benutzer:TS/Template-Verfahren
Inhaltsverzeichnis
Datenmaske, Template, View
aktives Template (alternative Schreibweise)
HTML und PHP werden in einer PHP-Datei gemischt notiert, im folgenden Beospiel in einer alternativen Schreibweise.
Der Bearbeiter des Templates erhält dadurch volle Kontrolle über den PHP-Parser und damit auch über weite Teile des Hosts.
personlist.tpl.php
<p>Folgende Personen entsprechen deinen Kriterien:</p>
<table>
<thead>
<tr>
<th>P-Nr</th>
<th>Name</th>
<th>DNA-Checksumme</th>
</tr>
</thead>
<tbody>
<?php foreach ($_personlist as $key => $_person): ?>
<tr>
<td><? echo htmlspecialchars($key); ?></td>
<td><? echo htmlspecialchars($_person['name']); ?></td>
<td><? echo htmlspecialchars($_person['dnaChecksum']); ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
geklaut bei Gunnar im Forum
Und die Daten hierfür:
personlist.data.php
<?php $_personlist = array(); $_personlist[1235] = array(); $_personlist[1235]['name'] = 'Mustermann, Manuela'; $_personlist[1235]['dnaChecksum'] = 'ab698zAA123uUssb'; $_personlist[7001] = array(); $_personlist[7001]['name'] = 'Bond, James'; $_personlist[7001]['dnaChecksum'] = 'xySex1234forEver'; ?>
Die Daten können auch im leicht lesbaren Ini-Format erfasst werden, das dann mit der Funktion ini_read() in ein Array eingelesen werden kann.
Es reicht dann später, beide in ein gemeinsame Skript einzubinden:
personlist.view.php
include('personlist.data.php');
include('personlist.tpl.php');
Zu beachten sind dabei:
- (-) Der Templateersteller erhält vollen Zugriff auf das PHP-Runtimesystem
- (!) Daten müssen vor dem Template eingebunden werden
- (+) Anweisungen für bedingte, revolvierende und alternative Inhalte können direkt codiert werden
- (!) in der vorliegenden Form wird die Datenverfügbarkeit nicht geprüft. Ein Zugriff auf ein nicht vorhandenes Array-Element liefert mindestens eine Notice.
passives Template
Das Templatesystem für passive Templates besteht aus den Komponenten:
- HTML-Templates
- Datenhaltung
- View-Controller
- Funktionssammlung (Includables) bzw. Methodensammlung (Klassen)
- Hilfsfunktionen
- CSS-Dateien
Passive Templates können von Benutzern erstellt oder geändert werden, die sich mit HTML rudimentär auskennen. Auf das PHP-Runtime-System erhalten sie keinen Zugriff und benötigen diesen auch nicht. Sie greifen auf vorbereitete und überprüfte Funktionen der Datenhaltung zu, um die Ergebnislisten dann mittels der View-Controller-Funktionen mit ihren Templates zu verbinden. Die Bezeichner für benutzbare Datenfelder werden ihnen bereitgestellt (z. B. in einem Muster).
Einfache Templates eignen sich für mehrsprachige Anzeige von Webseiten und zum Aufbau einfacher Dialogformulare ohne Bereichen mit wiederholten Daten (Tabellen, Listen, ...)
einfaches statisches Template
personinfo.tpl.html
Template mit dynamischer Dateneinbindung
personlist.tpl.html
<!DOCTYPE html>
<html>
<head>
<title>{[-TITLE-]}</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="standard.css">
</head>
<body>
<h3>{[-ÜBERSCHRIFT-]}</h3>
<table>
<thead>
<tr>
<th>{[-CAP-PNR-]}</th>
<th>{[-CAP-NAME-]}</th>
<th>{[-CAP-DNA-]}</th>
</tr>
</thead>
<tbody>
<!--REPROW-PERSONLIST-->
<tr>
<td>{[-PKEY-]}</td>
<td>{[-NAME-]}</td>
<td>{[-DNA-]}</td>
</tr>
<!--/REPROW-PERSONLIST-->
</tbody>
</table>
<p><a href="/_Artikel%20templatetechniken/passives_template/">{[-TAGTEXT-BASE-]}</a></p>
</body>
</html>
Wie wir sehen, gibt es außer dem Character-Encoding, dem Stylesheet und dem Linkziel keinerlei hart codierte Daten in dieser HTML-Datei. Diese drei festen Werte leisten wir uns, weil sie in unserm gesamten Projekt gleich bleiben.
Darüberhinaus gibt es Platzhalter und Marken. Die Platzhalter werden durch klar gekennzeichnete Start- und Ende-Zeichenketten (eigentlich auch Marken) gekennzeochnet. Diese Zeichenketten dürfen in den statischen Angaben des Templates und bedignt auch in den Nutzdaten nicht vorkommen. Dies müssen wir später berücksichtigen.
Die Marken sind als HTML-Kommentare ausgeführt und bezeichnen den "Repeat-Bereich", der in diesem Muster-template nur einmal benötigt wird. Es gibt eine eindeutige Startmarke und eine ebenso eindutig dazugehörige Endemarke. Unsere Controller-Methoden (oder Funktionen) werden später dafür sorgen, dass der Bereich zwischen den Marken ausgeschnitten und - so oft wiederholt, wie notwendig - mit Daten gefüllt wieder eingefügt wird.
Das Template lässt sich in dieser Form mit jedem üblichen Browser anzeigen und sein Erscheinungsbild (Design) mittels CSS steuern. Der Template-Entwickler kann daher seiner Phantasie bereits vollständig freien Lauf lassen :-)
Die Wahl der Bezeichner ist bei uns noch vollkommen frei, später werde sie dem Template-Entwickler vom Controller-System vorgeschlagen.
Template mit Formular
personsearch.tpl.html
<!DOCTYPE html>
<html>
<head>
<title>{[-TITLE-]}</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="standard.css">
</head>
<body>
<h3>{[-ÜBERSCHRIFT-]}</h3>
<form method="post" action="{[--FORM-ACTION-]]}" enctype="multipart/form-data">
<table>
<tbody>
<!--REPROW-SEARCHFIELDS-->
<tr>
<td>{[-CAP-]}</td>
<td><input type="text" size="50" value="{[-DATA-]}"></td>
<td>
<fieldset>
<input type="radio" id="no" name="[btn]sort" value="0" data-chk="{{ATTR-SORTCHK-NO}}" >
<label for="no"><img src="/icons/no.gif" alt="Icon Nosort"></label><br>
<input type="radio" id="up" name="[btn]sort" value="up" data-chk="{[-ATTR-SORTCHK-UP-]}">
<label for="up"><img src="/icons/up.gif" alt="Icon Upsort"></label><br>
<input type="radio" id="dn" name="[btn]sort" value="dn" data-chk="{[-ATTR-SORTCHK-DN-]}">
<label for="dn"><img src="/icons/dn.gif" alt="Icon Downsort"></label>
</fieldset></td>
<td><input type="checkbox" id="[btn]use" value="1" data-chk="{[-ATTR-SORTUSE-]}"></td>
</tr>
<!--/REPROW-SEARCHFIELDS-->
</tbody>
</table>
<p><input type="submit" value="{[-BTNTXT-SUBMIT-]}" name="btn[search]"></p>
</form>
<p><a href="/_Artikel%20templatetechniken/passives_template/">{[-TAGTEXT-BASE-]}</a></p>
</body>
</html>
