Das Beispiel aus dem Artikel “Autovollkommen”, erschienen im Webstandards Magazin, kann unter der folgenen URL eingesehen werden:

http://jg-webdesign.de/jg-data/artikel/webstandardsmagazin/0409/

Kurze Einführung zu Apache 2 unter Windows

Um Apache 2 unter Windows zu betreiben gibt es unterschiedliche Ansätze. Zunächst gibt es den Server zum direkten Download von den Seiten der Apache Software Foundation. In dieser Variante fehlen Ihnen aber noch die weiteren Zutaten wie Datenbank (z.B. mySQL, etc.) und Interpreter (z.B. Perl, PHP, etc.), diese müssen von Hand installiert werden.

Einfacher wird es mit Komplettpaketen wie WampServer, XAMP oder der Zend Server Community Edition. Diese Pakete installieren mit wenigen Mausklicks eine komplette Enwicklungsumgebung mit Datenbank, Interpretersprachen, und vieles mehr.

Um einen virtuellen Host einzurichten müssen Sie die gewünschte Konfiguration in der Datei /conf/httpd.conf des Apache Webserver einfügen. Früher wurden diese Angaben am Ende der Datei untergebracht. Mittlerweile wird dazu die Datei /conf/extra/httpd-vhosts.conf verwendet. Damit dies korrekt funktioniert müssen Sie in der httpd.conf an entsprechender Stelle diese Datei referenzieren, indem Sie die Kommentarauszeichnung (#) davor entfernen. Suchen Sie dazu nach der folgenden Zeile:

Include conf/extra/httpd-vhosts.conf

Eine einfache Konfiguration eines virtuellen Hosts könnte sich beispielsweise wie folgt darstellen:

NameVirtualHost mein.server
<VirtualHost 127.0.0.1>
   DocumentRoot C:\Programme\Zend\Apache2\htdocs
   ServerName mein.server
   ServerAlias mein.server
</VirtualHost>

Diese Einstellung besagt, dass beim Aufruf von “http://mein.server” die Webanwendung aus dem Verzeichnis der Eigenschaft DocumentRoot geladen wird. Für weitere Details zu den möglichen Einstellungen eines virtuellen Hosts möchte ich Sie auf die deutsche Dokumentation von Apache verweisen: http://httpd.apache.org/docs/2.2/de/vhosts/.

Damit Sie einen virtuellen Host aufrufen können, müssen Sie den Servernamen in der hosts-Datei im Verzeichnis C:\WINDOWS\system32\drivers\etc\ für Windows bekannt machen. Dazu fügen Sie an das Ende der Datei die IP-Adresse und den dazugehörenden Namen für die Adressauflösung im System ein:

127.0.0.1       mein.server

Sie sollten nun auf Ihren neuen Entwicklungsserver mit der URL “http://mein.server” zugreifen können. Beachten Sie, dass bei jeder Änderung der Apache Konfiguration der Webserver neu gestartet werden muss, damit diese wirksam wird.

jogWinVhostBatch.bat

Wenn man häufig neue virutelle Server anlegen muss, kann diese Aufgabe sehr lästig werden. Aus diesem Grund habe ich ein kleines Batch-Programm geschrieben, das mir diese Arbeit etwas erleichtert. Das Tool hängt in der httpd-vhosts.conf einen neuen Eintrag an, welcher über ein Template zuvor bestimmt wird. Außerdem wird in der hosts-Datei von Windows der Nameserver ans Ende der Datei eingetragen. Und zu guter Letzt, werden beide Dateien zur weiteren Bearbeitung, bzw. Kontrolle geöffnet.

Die Konfiguration des Batch-Tools erfolgt innerhalb von jogWinVhostBatch.bat anhand der folgenden Variablen:

  set TEMPL=vhost.txt
  set VHOST=C:\...\httpd-vhosts.conf
  set HOSTS=C:\WINDOWS\system32\drivers\etc\hosts
  set VHOST_KOMMENTAR=ZF Test Projekt
  set VIRTUAL_HOST=bsp.tld
  set ROOT_DIR=C:\testdomains\bsp.tld\public

Die Variablen TEMPL, VHOST und HOSTS verweisen auf den Systempfad der entsprechenden Dateien. Die restlichen Variablen werden mit den Platzhaltern in der Template-Datei ausgetauscht, die wie folgt vereinbart wurden:

{VARIABLEN_NAME}

Die Variable VIRTUAL_HOST hat die Besonderheit, dass ihr Inhalt als Nameserver in die hosts-Datei von Windows geschrieben wird. Achtung, der letzte Eintrag in dieser Datei muss eine neue Zeile sein, andernfalls wird beim ersten Ausführen der Batch-Datei der neue Eintrag in die gleiche Zeile ans Ende gesetzt. Beim nächsten Eintrag erfolgt ein korrekter Zeilenumbruch.

Mit Hilfe der Template-Datei können Sie Ihre eigene Konfiguration eines virtuellen Hosts bestimmen und beliebige Variablen nach diesem Muster einfügen. In der Standardvariante werden die Variablen VHOST_KOMMENTAR, VIRTUAL_HOST und ROOT_DIR ersetzt. Falls Sie eigene, bzw. zusätzliche Variablen verwenden möchten, müssen Sie pro zu ersetzende Variable den folgenden Befehl an geeigneter Stelle der Batch-Datei eintragen

call :FncReplaseString "{VARIABLEN_NAME}"  "%VARIABLEN_NAME%"  %VHOST%

Damit wird der Suchen&Ersetzen Algorithmus aufgerufen und ausgeführt.

Download

Dieses kleine Batch-Tool wird kostenlos und ohne Einschränkung zum Download angeboten. Die Verwendung erfolgt auf eigene Gefahr, eine Gewährleistung wird nicht übernommen.

Download Version 1.0: jogWinVhostBatch.zip (~2kb)

Historie

Version 1.0 – 30.10.2009

Das Zend Studio hilft diese Aufgabe etwas bequemer zu erledigen. Seit der Version 1.8 des Zend Frameworks gibt es das Projekt “Zend Tool” mit desse Hilfe man über die Kommandozeile ein entsprechendes Projekt verwalten kann. In Verbindung mit dem Zend Server wird diese Option zudem automatisch mit installiert, ohne das ein manuelle Konfiguration nötig ist.

Was vielleicht nicht jeder weiß ist, dass man mit dem Zend Studio 7 das “Zend Tool” über das Menü “Project → Zend Tool” direkt aufrufen kann. Noch einfacher über die Tastenkombination “CTRL+2“, worauf sich das folgende Fenster öffnet.

Integrierte Kommandozeile zum Zend Tool

Hier kann man nun mit entsprechenden Eingaben die gewünschten Aktionen ausführen. Für manche Optionen wird eine Hilfe mit kurzer Beschreibung eingeblendet. Zahlreiche Möglichkeiten sind bisher noch nicht dokumentiert oder funktionieren derzeit nicht. Im folgenden beschreibe ich einige der wichtigsten Befehle für das schnelle Arbeiten mit dem Zend Framework.

zf create project PROJEKTNAME

Mit diesem Befehl wird ein neues Projekt im aktuellen Arbeitsbereich erstellt. Dabei werden die Standardverzeichnisse und -dateien eines typischen Zend Framework Projekts anglegt:

├───application
│   │   Bootstrap.php
│   │
│   ├───configs
│   │       application.ini
│   │
│   ├───controllers
│   │       ErrorController.php
│   │       IndexController.php
│   │
│   ├───models
│   └───views
│       ├───helpers
│       └───scripts
│           ├───error
│           │       error.phtml
│           │
│           └───index
│                   index.phtml
│
├───library
├───public
│       .htaccess
│       index.php
│
└───tests
    │   phpunit.xml
    │
    ├───application
    │       bootstrap.php
    │
    └───library
            bootstrap.php

Das alles will man sicher nicht von Hand anlegen ;o) Für die weitere Arbeit müssen Sie in das aktuelle Projekt mit dem Befehl cd PROJEKTNAME wechseln. Dies wird mit der Meldung context was set to /PROJEKTNAME bestätigt.

zf create controller CONTROLLERNAME

Hiermit wird ein neuer Controller, die dazugehörige View sowie eine Test-Datei im aktuellen Projekt erzeugt. Ein Auszug aus der daraus resultierenden Verzeichnisstruktur soll dies verdeutlichen:

│   ├───controllers
│   │       TestController.php
│   └───views
│       └───scripts
│           ├───test
│           │       test.phtml
│
└───tests
    ├───application
    │   └───controllers
    │           TestControllerTest.php

Der neue Controller kann anschließend sofort ausgeführt werden, da eine leere Index-Action mit angelegt wird. Die entsprechende View wird per Default mit folgendem Inhalte gefüllt:

<br /><br /><center>View script for controller <b>Test</b> and script/action name <b>index</b></center>

Warum dazu das veraltete und in XHTML nicht mehr vorhandene center-Tag verwendet weiß ich nicht. Da hätte man dann auch gleich das blink-Tag wieder aufleben lassen können ;o)

zf add action ACTIONNAME CONTROLLERNAME

Dieser Befehl erzeugt eine neue Action im referenzierten Controller und legt zugleich ein entsprechendes Template im View-Ordner an. Der Inhalt des Controllers stellt sich anschließend wie folgt dar:

<?php

class TestController extends Zend_Controller_Action
{

    public function init()
    {
        /* Initialize action controller here */
    }

    public function indexAction()
    {
        // action body
    }

    public function ACTIONNAMEAction()
    {
        // action body
    }

}

Dieser Befehl muss für jede weitere Action erneut ausgeführt werden. Dabei fügt “Zend Tool” die entsprechende Method jeweils ans Ende im angegebenen Controller ein.

zf create view ACTIONNAME VIEWNAME

Mit dieser Angabe erstellen Sie ein View ohne zugleich einen Controller anzulegen.

zf create module MODULLNAME

Dieser Befehl erzeugt ein neues Modul im Verzeichnis /modules mit der folgenden Verzeichnisstruktur:

│   ├───modules
│   │   ├───Test
│   │   │   ├───controllers
│   │   │   ├───models
│   │   │   └───views
│   │   │       ├───filters
│   │   │       ├───helpers
│   │   │       └───scripts

Falls das Verzeichnis /modules bisher nicht vorhanden war, wird es beim ersten Aufruf des Befehls mit angelegt.

Anmerkung

Das waren aus meiner Sicht die wichtigsten und zugleich nützlichsten Befehle, welche in der aktuellen Version von “Zend Tool” angeboten werden. Die weitere Entwicklung zu diesem praktischen Werkzeug sollte man auf jeden Fall im Auge behalten. Die Supportseite für das “Zend Tool” findet man unter der URL http://framework.zend.com/issues/browse/ZF-6571.

Ein Problem hatte ich aber noch.
Da ich meine Projekte lokal unterschiedlich organisiere, fehlte mir noch die Möglichkeit, z.B. ein auf dem Zend Framework basierendes Projekt an einer bestimmte Stelle auf dem Dateisystem zu speichern. Zend Studio organisiert seine Projekte in sogenannte Arbeitsbereiche in einem bei der Installation vorgegebenen Verzeichnis. Möchte man nun sein eigenes Standardverzeichnis verwenden, kann dies mit der Option “Create project from existing source” auswählen werden. Dies hat jedoch den Nachteil, dass bei einem ZF Projekt die Grundstruktur nicht automatisch mit angelegt wird.

Achtung: Falls man ein auf diese Art angelegtes Projekt in Zend Studio löscht, wird auch das übergeordnete Hautverzeichnis mit gelöscht!

Eine auf den ersten Blick unscheinbare Option in den Einstellungen “Window → Preferences” des Zend Studios ermöglicht es
dem Anwender, beim Start einen neuen Arbeitsbereich anzugeben bzw. auszuwählen. Im Bereich “General → Startup and Shutdown → Workspaces” müssen Sie die Option “Prompt for workspace on startup” aktivieren. Die direkte Eingabe eines neuen Arbeitsbereiches ist in dieser Maske nicht möglich.

Zend Studio Workspace Einstellungen

Über “File → Switch Workspace → ...” kann man zwischen den Arbeitsbereichen umschalten. Dazu wird das Zend Studio neu geladen, da Eclipse intern über einen entsprechenden Parameter für den Arbeitsbereich gestartet wird.

Zend Studio Workspace wählen

Arbeitsbereiche sind sehr praktisch, um Projekte in unterschiedlichen Ordnern zu organisieren. Alle Einstellungen der IDE werden für den jeweiligen Arbeitsbereich separat vorgenommen. Falls man für längere Zeit in einem bestimmten Arbeitsbereich arbeitet, kann man die Option “Prompt for workspace on startup” wieder deaktivieren oder die entsprechende Option im Startfenster aktiveren.

jog.Form.NestedSelect()

Kurzum, nachdem ich keine für mich brauchbaren Beispiele fand, habe ich selbst ein Objekt für diese Aufgabe geschrieben. Es hört auf den Namen NestedSelect und ist im Namespace jog.Form gefangen. Mit diesem Objekt ist es möglich, beliebig tief verschachtelte select-Elemente darzustellen. Als Datenquelle wird eine einfache Baumstruktur verwendet. Die Beziehung der Einträge zueinander wird dabei über die Eigenschaften id und pid gesteuert. Der Einsatz des “Nested-Set”-Models erschien mir für diesen Zweck nicht nötig.

Konstruktor

Ein neues Objekt wird wie folgt instanziiert:

new jog.Form.NestedSelect({options})

Die möglichen Eigenschaften werden über ein Objek-Literal vereinbart. Diese Klasse besitzt die folgenden Eigenschaften:

{
	'prefix' : 'string',
	'db'     : [array],
	'sText'  : 'string',
	'sEmpty' : 'string'
}

prefix

Mit dieser Eigenschaft übergeben Sie das Prefix der Element-IDs ihrer gruppierten select-Elemente. Diese Elemente müssen nach einem vorgegebenen Muster aufgebaut sein. Dies ist die Prefix und eine nummerierte Reihenfolge 1...n. Die name-Attribute dieser Elemente müssen ebenfalls mit der gleichen Prefix als Array benannt werden. Beachten Sie dabei auch die Groß-/Kleinschreibung.

<select id="bsp1" name="bsp[]"></select>
<select id="bsp2" name="bsp[]"></select>
...

Die Auszeichnung mittels einem id-Attribut hat den Vorteil, dass die Elemente an beliebiger Stelle und in willkürlicher Reihenfolge gesetzt werden können. Sie stehen trotzdem miteinander in logischer Verbindung.

db

Die Beziehungen der jeweiligen select-Elemente werden über die Ebenen der Baumstruktur hergestellt. Das folgende Beispiel stellt eine Baumstruktur mit einer Tiefe von drei Ebenen dar. Dies bedeutet, dass es ein “select-Set” mit drei Elementen geben wird.

	Nr. 1
		Nr. 1.1
			Nr. 1.1.1
			Nr. 1.1.2
			Nr. 1.1.3
		Nr. 1.2
		Nr. 1.3
	Nr. 2
		Nr. 2.1
	Nr. 3

Die Eigenschaft db bildet diesen Baum über ein einfaches Modell ab, wobei die Beziehung der Elemente über die Eigenschaft pid hergestellt wird. In pid wird die id des Eltern-Elements angegeben. Auf diese Weise entsteht eine einfach verkettete Liste.

	'db' : [
		{ 'id' : 1, 'pid' : 0, 'title' : 'Nr. 1'     },
		{ 'id' : 2, 'pid' : 1, 'title' : 'Nr. 1.1'   },
		{ 'id' : 3, 'pid' : 2, 'title' : 'Nr. 1.1.1' },
		{ 'id' : 4, 'pid' : 2, 'title' : 'Nr. 1.1.2' },
		{ 'id' : 5, 'pid' : 1, 'title' : 'Nr. 1.2'   },
		{ 'id' : 6, 'pid' : 1, 'title' : 'Nr. 1.3'   },
		{ 'id' : 7, 'pid' : 0, 'title' : 'Nr. 2'     },
		{ 'id' : 8, 'pid' : 0, 'title' : 'Nr. 3'     },
		{ 'id' : 9, 'pid' : 7, 'title' : 'Nr. 2.1'   }
	]

sText und sEmpty

Mit Hilfe dieser Eigenschaften können Sie den Standardtext für die jeweils erste Option der select-Elemente bestimmen. Per Default ist für sText der String “–SELECT–” und für sEmpty die Zeichenkette “–EMPTY–” eingerichtet.

Beispiel

Die folgenden Beispiele zeigen die unabhängige Verwendung dieser Klasse mit zwei unterschiedlichen “select-Sets”. Wie Sie erkennen können, ist es damit möglich, beliebig viele unabhängige verkettete select-Elemente zu erzeugen.

Der Quellcode aus diesem Beispiel stellt sich wie folgt dar:

<form>
<p>
	<select id="a1" name="a[]" style="width:100px;"></select>
	<select id="a2" name="a[]" style="width:100px;"></select>
	<select id="a3" name="a[]" style="width:100px;"></select>
</p>
<p>
	<select id="b1" name="b[]" style="width:100px;"></select>
	<select id="b2" name="b[]" style="width:100px;"></select>
</p>
</form>
<script src="jog.Form.NestedSelect.js" type="text/javascript"></script>
<script type="text/javascript">
var a = new jog.Form.NestedSelect({
	'prefix' : 'a',
	'db' : [
		{ 'id' : 1, 'pid' : 0, 'title' : 'Nr. 1' },
		{ 'id' : 2, 'pid' : 1, 'title' : 'Nr. 1.1' },
		{ 'id' : 3, 'pid' : 2, 'title' : 'Nr. 1.1.1' },
		{ 'id' : 4, 'pid' : 2, 'title' : 'Nr. 1.1.2' },
		{ 'id' : 5, 'pid' : 1, 'title' : 'Nr. 1.2' },
		{ 'id' : 6, 'pid' : 1, 'title' : 'Nr. 1.3' },
		{ 'id' : 7, 'pid' : 0, 'title' : 'Nr. 2' },
		{ 'id' : 8, 'pid' : 0, 'title' : 'Nr. 3' },
		{ 'id' : 9, 'pid' : 7, 'title' : 'Nr. 2.1' }
	]
});
var b = new jog.Form.NestedSelect({
	'prefix' : 'b',
	'db' : [
		{ 'id' : 1, 'pid' : 0, 'title' : 'Auto' },
		{ 'id' : 2, 'pid' : 1, 'title' : 'Audi' },
		{ 'id' : 3, 'pid' : 1, 'title' : 'BMW' },
		{ 'id' : 4, 'pid' : 1, 'title' : 'Opel' },
		{ 'id' : 5, 'pid' : 0, 'title' : 'Farbe' },
		{ 'id' : 6, 'pid' : 5, 'title' : 'Grün' },
		{ 'id' : 7, 'pid' : 5, 'title' : 'Rot' }
	]
});
</script>

Lizenz und Download

Die JavaScript-Klasse jog.Form.NestedSelect.js ist unter einer “Creative Commons-Lizenz” lizenziert. Falls Sie diese Klasse in kommerziellen Projekten nutzen möchten, setzen Sie sich bitte mit mir per Email in Verbindung.

Download Version 1.0: jog.Form.NestedSelect.js (2kb)

Falls Sie diese Klasse für Ihre Projekte einsetzen, würde ich mich über einen Hinweis freuen.

Historie

Version 1.0 – 21.09.2009