Dijit-Spezifische View Helfer
Aus dem Dojo Handbuch: "Dijit ist ein Widget System das über Dojo gelegt wurde.". Dijit
enthält eine Vielzahl von Layout und Formular Widgets die erstellt wurden um
Zugriffsfeatures, Lokalisation, und standardisiertes (und themenbasierendes) Look-and-Feel
zu bieten.
Zend Framework wird mit einer Vielzahl an View Helfern ausgeliefert die es erlauben Dijits
in eigenen View Skripten darzustellen und anzupassen. Es gibt drei Basistypen:
Layout Container: Diese wurden erstellt um in View Skripten
verwendet, oder von Formular Dekoratoren für Formulare, Unterformulare oder
Anzeigegruppen konsumiert zu werden. Sie hüllen die verschiedenen angebotenen
Klassen in dijit.layout ein. Jeder Dijit Layout Viewhelfer
erwartet die folgenden Argumente:
$id: Der Name des Containers oder die
DOM ID.
$content: Der Inhalt der vom Layout Container umhüllt
werden soll.
$params (Optional): Dijit-spezifische Parameter.
Grundsätzlich kann jedes nicht-HTML Attribut verwendet werden um den Dijit
Layout Container zu konfigurieren.
$attribs (Optional): Jedes zusätzliche
HTML Attribut das verwendet werden soll um den Container
Div darzustellen. Wenn der Schlüssel 'id' an dieses Array übergeben wird,
wird es für die ID des DOM Formular Elements verwendet
und $id wird für seinen Namen verwendet.
Wenn an den Dijit Layout Viewhelfer keine Argumente übergeben werden, wird der
Helfer selbst zurückgegeben. Das erlaubt es den Inhalt zu erhalten, was oft der
einfachste Weg ist um Inhalt an den Layout Container zu übergeben. Beispiele für
diese Funktionalität werden später in diesem Kapitel gezeigt.
Form Dijit: Auch wen das dijit.form.Form
Dijit für die Verwendung von Dijit Form Elementen nicht vollständig notwendig ist,
stellt es sicher das, wenn ein Versuch unternommen wird ein Formular zu übertragen
das die Client-seitigen Prüfungen nicht besteht, die Übertragung angehalten und eine
Prüffehlermeldung geworfen wird. Der Form Dijit Viewhelfer erwartet die folgenden
Argumente:
$id: Der Name des Containers oder der
DOM ID.
$attribs (Optional): Alle zusätzliche
HTML Attribute die verwendet werden sollten um das
Container Div darzustellen.
$content (Optional): Der Inhalt der im Formular
umschlossen wird. Wenn keiner übergeben wird, wird ein leerer String
verwendet.
Die Reihenfolge der Argumente variiert von den anderen Dijits um die Kompatibilität
mit dem standard form() Viewhelfer zu haben.
Form Elemente: Diese wurden designed um von
Zend_Form verwendet zu werden, können aber auch selbstständig
in Viewsktipten verwendet werden. Jedes Dijit Element Viewhelfer erwartet die
folgenden Elemente:
$id: Der Name des Elements oder die
DOM ID.
$value (Optional): Der aktuelle Wert des Elements.
$params (Optional): Dijit-spezifische Parameter.
Grundsätzlich können alle nicht-HTML Attribute für die Konfiguration des
Dijits verwendet werden.
$attribs (Optional): Jedes zusätzliche
HTML Attribut das verwendet werden soll um das Dijit
darzustellen. Wenn der Schlüssel 'id' an dieses Array übergeben wird, wird
es für die ID des DOM Formular Elements verwendet und
$id wird für seinen Namen verwendet.
Einige Elemente benötigen mehr Argumente; diese werden in den Beschreibungen der
individuellen Elementhelfer erklärt.
Um diese Viewhelfer zu verwendenn, muß der Pfad zu den Dojo Viewhelfern im View Objekt
registriert werden.
Registrierung des Präfix Pfades zu den Dojo Viewhelfern
addHelperPath('Zend/Dojo/View/Helper', 'Zend_Dojo_View_Helper');
]]>
Dijit Layout Elemente
Die Familie der dijit.layout Elemente sind für die Erstellung von
eigenen, vorhersagbaren Layouts für die eigene Site. Für alle Fragen über die generelle
Verwendung lesen Sie
hierüber im Dojo Handbuch nach.
Alle Dijit Layoutelemente haben die Signatur string ($id = null, $content = '',
array $params = array(), array $attribs = array()). In allen Fällen wird,
wenn man keine Argumente übergibt, das Helferobjekt selbst zurückgegeben. Das gibt
einem Zugriff auf die captureStart() und
captureEnd() Methoden, welche es erlauben Inhalte zu holen
statt diese an den Layout Container zu übergeben.
AccordionContainer:
dijit.layout.AccordionContainer. Fügt
alle Ausschnitte vertikal zusallen; das Klicken auf die Überschrift eines
Ausschnittes expandiert diesen und zeigt den betreffenden Ausschnitt an.
accordionContainer(
'foo',
$content,
array(
'duration' => 200,
),
array(
'style' => 'width: 200px; height: 300px;',
),
); ?>
]]>
AccordionPane:
dijit.layout.AccordionPane. Für die
Verwendung im AccordionContainer.
accordionPane(
'foo',
$content,
array(
'title' => 'Titel des Ausschnittes',
),
array(
'style' => 'background-color: lightgray;',
),
); ?>
]]>
BorderContainer:
dijit.layout.BorderContainer. Ermöglicht
Layouts mit optional größenveränderbaren Ausschnitten wie man Sie in
traditionellen Anwendungen oft sieht.
borderContainer(
'foo',
$content,
array(
'design' => 'headline',
),
array(
'style' => 'width: 100%; height: 100%',
),
); ?>
]]>
ContentPane:
dijit.layout.ContentPane. Wird in allen
Containern ausser AccordionContainer verwendet.
contentPane(
'foo',
$content,
array(
'title' => 'Titel des Ausschnittes',
'region' => 'left',
),
array(
'style' => 'width: 120px; background-color: lightgray;',
),
); ?>
]]>
SplitContainer:
dijit.layout.SplitContainer. Erlaubt
Ausschnitte mit größenveränderbarem Inhalt; sollte in Dojo nicht mehr verwendet
werden, stattdessen BorderContainer.
splitContainer(
'foo',
$content,
array(
'orientation' => 'horizontal',
'sizerWidth' => 7,
'activeSizing' => true,
),
array(
'style' => 'width: 400px; height: 500px;',
),
); ?>
]]>
StackContainer:
dijit.layout.StackContainer. Alle
Ausschnitte eines StackContainers werden in einem Stack platziert; erstelle
Buttons oder Funktionalität um einen auf einmal zu erhalten.
stackContainer(
'foo',
$content,
array(),
array(
'style' => 'width: 400px; height: 500px; border: 1px;',
),
); ?>
]]>
TabContainer:
dijit.layout.TabContainer. Alle Ausschnitte
eines TabContainers werden in einem Stack platziert, wobei Tabs auf einer Seite
positioniert werden um zwischen Ihnen zu wählen.
tabContainer(
'foo',
$content,
array(),
array(
'style' => 'width: 400px; height: 500px; border: 1px;',
),
); ?>
]]>
Die folgenden Erfassungsmethoden sind für alle Layout Container vorhanden:
captureStart($id, array $params = array(), array $attribs =
array());: Beginnt die Erfassung von Inhalt um Ihn in einem
Container einzufügen. $params referiert auf die Dijit
Parameters die mit dem Container verwendet werden, während
$attribs auf alle generellen HTML
Attribute die verwendet werden, zeigt.
Container können für die Erfassung gekoppelt werden, solange keine IDs
doppelt vorhanden sind.
captureEnd($id): Beendet die Erfassung von Inhalten
die in den Container übernommen werden. $id sollte auf eine
Id zeigen die vorher bei dem Aufruf von captureStart()
verwendet wurde. Gibt einen String zurück der den Container und seinen Inhalt
repräsentiert, wie wenn man einfach den Inhalt an den Helfer selbst übergeben
hätte.
Beispiel eines BorderContainer Layout Dijits
BorderContainers, speziell wenn Sie mit der Fähigkeit gekoppelt werden Inhalte zu
erfassen, sind nützlich um komplexe Layouteffekte zu erhalten.
borderContainer()->captureStart('masterLayout',
array('design' => 'headline'));
echo $view->contentPane(
'menuPane',
'Das ist der Menü Ausschnitt',
array('region' => 'top'),
array('style' => 'background-color: darkblue;')
);
echo $view->contentPane(
'navPane',
'Das ist der Navigations Ausschnitt',
array('region' => 'left'),
array('style' => 'width: 200px; background-color: lightblue;')
);
echo $view->contentPane(
'mainPane',
'Das ist der Hauptabschnitt',
array('region' => 'center'),
array('style' => 'background-color: white;')
);
echo $view->contentPane(
'statusPane',
'Status area',
array('region' => 'bottom'),
array('style' => 'background-color: lightgray;')
);
echo $view->borderContainer()->captureEnd('masterLayout');
]]>
Dijit Formularelemente
Dojo's Formularprüfung und Eingabe Dijits sind im dijit.form Baum.
Für zusätzliche Informationen über die generelle Verwendung dieser Elemente, sowie der
akzeptierten Parameter besuchen
Sie bitte die dijit.form Dokumentation.
Die folgenden Dijit Formularelemente sind im Zend Framework vorhanden. Ausser wo es
beschrieben wird, haben alle die Signatur string ($id, $value = '', array
$params = array(), array $attribs = array()).
Button: dijit.form.Button. Zeigt einen
Formular Button.
button(
'foo',
'Zeig mich!',
array('iconClass' => 'myButtons'),
); ?>
]]>
CheckBox: dijit.form.CheckBox. Zeigt
eine Checkbox an. Akzeptiert ein optionales fünftes Argument, das Array
$checkedOptions, welches das folgende enthalten kann:
ein indiziertes Array mit zwei Werten, einen angehackten Wert und einem
nicht angehackten Wert, in dieser Reihenfolge; oder
ein assoziatives Array mit den Schnüsseln 'checkedValue' und
'unCheckedValue'.
Wenn $checkedOptions nicht vorhanden ist, wird 1 und 0
angenommen.
checkBox(
'foo',
'bar',
array(),
array(),
array('checkedValue' => 'foo', 'unCheckedValue' => 'bar')
); ?>
]]>
ComboBox: dijit.layout.ComboBox.
Comboboxen sind ein Hybrid zwischen einem Select und einer Textbox mit
automatischer Vervollständigung. Der grundsätzliche Unterschied ist das man eine
Option eingeben kann die nicht in der Liste der vorhandenen Optionen ist, und
trotzdem eine gültige Eingabe angenommen wird. Sie akzeptiert ein optionales
fünftes Argument, ein assoziatives Array $options; wenn es
angegeben wird, wird ComboBox als select dargestellt. Es
ist auch zu beachten dass die verschiedenen Labelwerte des
$options Arrays im Formular zurückgegeben werden -- nicht
die Werte selbst.
Alternativ kann eine Information übergeben werden die einen
dojo.data Datenspeicher bezeichnet der mit diesem Element zu
verwenden ist. Wenn er angegeben wird, wird die ComboBox als Texteingabe
(input) dargestellt, und wird seine Optionen über den
Datenspeicher holen.
Um einen Datenspeicher zu spezifizieren, muß eine der folgenden
$params Schlüsselkombinationen angegeben werden:
Der Schlüssel 'store' mit einem Arraywert; das Array sollte die
folgenden Schlüssel enthalten:
store: Der Name der Javascript Variable die
den Datenspeicher repräsentiert (das könnte der Name sein den
man für Ihn verwenden will).
type: Der Typ des Datenspeichers der
verwendet werden soll; z.B.,
'dojo.data.ItemFileReadStore'.
params (Optional): Ein assoziatives Array
von Schlüssel und Werte Paaren die zu verwenden sind um den
Datenspeicher zu konfigurieren. Der 'url' Parameter ist ein
typisches Beispiel.
Die Schlüssel:
store: Ein String der den Namen des
Datenspeicher zeigt der zu verwenden ist.
storeType: Ein String der den
dojo.data Typ des Datenspeichers anzeigt der
zu verwenden ist
(z.B. 'dojo.data.ItemFileReadStore').
storeParams: Ein assoziatives Array von
Schlüssel und Wertepaaren mit denen der Datenspeicher
konfiguriert wird.
comboBox(
'foo',
'bar',
array(
'autocomplete' => false,
),
array(),
array(
'foo' => 'Foo',
'bar' => 'Bar',
'baz' => 'Baz',
)
);
// Als dojo-aktiviertes Element:
echo $view->comboBox(
'foo',
'bar',
array(
'autocomplete' => false,
'store' => 'stateStore',
'storeType' => 'dojo.data.ItemFileReadStore',
'storeParams' => array('url' => '/js/states.json'),
),
);
]]>
CurrencyTextBox:
dijit.form.CurrencyTextBox. Abgeleitet von
ValidationTextBox, und bietet Clientseitige Prüfung von Wärgungen. Es erwartet
das der Dijit Parameter 'currency' mit einem entsprechenden 3-zeichen
Währungscode angegeben wird. Man kann auch anderen Dijit Parameter spezifizieren
die für ValidationTextBox und TextBox gültig sind.
currencyTextBox(
'foo',
'$25.00',
array('currency' => 'USD'),
array('maxlength' => 20)
);
]]>
Probleme mit Builds
es gibt aktuell bekannte Probleme bei der
Verwendung der CurrencyTextBox mit Build Layern. Ein bekannter
Work-Around ist sicherzustellen dass das http-equiv Metatag des
Content-Types des Dokument auf das Zeichenset utf-8 gestellt wird, was mit
folgendem Aufruf gemacht wird:
headMeta()->appendHttpEquiv('Content-Type',
'text/html; charset=utf-8');
]]>
Das bedeutet natürlich, das man sicherstellen muß das der
headMeta() Platzhalter im Layout Skript ausgegeben
wird.
DateTextBox: dijit.form.DateTextBox.
Wird von ValidationTextBox abgeleitet, und bietet sowohl Client-seitige
Prüfungen von Daten, als auch einen Dropdown Kalender für die Auswahl von Daten.
Man kann jeden Dijit Parameter spezifizieren der für ValidationTextBox oder
TextBox vorhanden ist.
dateTextBox(
'foo',
'2008-07-11',
array('required' => true)
);
]]>
Editor: dijit.Editor. Bietet einen
WYSIGYG Editor über den Benutzer Inhalte erstellen oder
bearbeiten können. dijit.Editor ist ein pluginfähiger,
erweiterbarer Editor mit einer Vielzahl an Parametern die für die Anpassung
verwendet werden können; siehe in
die dijit.Editor Dokumentation für weitere Details.
editor('foo');
]]>
Das Editor Dijit verwendet standardmäßig div
Das Editor dijit verwendet standardmäßig ein HTML
DIV. Die Dokumentation
für dijit._editor.RichText zeigt dass es potentielle
Sicherheits Probleme bereiten kann wenn man es auf ein
HTML TEXTAREA erstellt.
Um eine sanfte Degration in Umgebungen zu erlauben in denen Javascript nicht
vorhanden ist, umhüllt Zend_Dojo_View_Helper_Editor
auch eine TEXTAREA in einem NOSCRIPT
Tag; der Inhalt dieser TEXTAREA wird richtig escaped
um sicherheitsproblematische Vektoren zu vermeiden.
FilteringSelect:
dijit.form.FilteringSelect. Wie die ComboBox ist das ein
Select und Text Hybrid der entweder eine angegebenen Liste von Optionen
darstellen kann, oder jene vom dojo.data Datenspeicher.
Anders als ComboBox, erlaubt FilteringSelect keine Eingabe einer Option die
nicht in seiner Liste vorhanden ist. Zusätzlich funktioniert es Sie ein Standard
Select in dem die Optionswerte, nicht die Label, zurückgegeben werden wenn das
Formular übertragen wird.
Bitte beachten Sie die obigen Informationen über die ComboBox für Beispiele und
mögliche Optionen für die Definition von Datenspeichern.
HorizontalSlider und VerticalSlider:
dijit.form.HorizontalSlider und
dijit.form.VerticalSlider. Schieber sind UI
Widgets für die Auswahl von Zahlen in einem gegebenen Bereich; es gibt eine
horizontale und eine vertikale Variante.
Grundsätzlich benötigen Sie die Dijit Parameter 'minimum', 'maximum' und
'discreteValues'. Diese definieren den Bereich der Werte. Andere übliche
Optionen sind:
'intermediateChanges' kann gesetzt werden um zu zeigen ob ein onChange
Event ausgelöst wird wenn der Gleiter genommen wird.
'clickSelect' kann gesetzt werden um das Klicken an einem Platz im
Schieber zu erlauben um den Wert zu setzen.
'pageIncrement' kann den Wert spezifizieren mit dem addiert oder
subtrahiert wird wenn pageUp und pageDown verwendet werden.
'showButtons' kann gesetzt werden um die Darstellung von Buttons auf
beiden Seiten des Schiebers, für die Veränderung des Wertes, zu
erlauben.
Die Implementation von Zend Framework erstellt ein verstecktes Element um den
Wert des Schiebers zu speichern.
Optional kann es gewünscht sein einen Maßstab oder ein Label für den Gleiter zu
zeigen. Um das zu tun, muß ein oder mehrere der Dijit Parameter 'topDecoration'
und/oder 'bottomDecoration' (HorizontalSlider) oder 'leftDecoration' und/oder
'rightDecoration' (VerticalSlider) hinzufügen. Jede von Ihnen erwartet die
folgenden Optionen:
container: Der Name des Containers.
labels (Optional): Ein Array von Labels das
verwendet wird. Leere Strings können an beiden Seiten verwendet werden
um Labels nur für die inneren Werte anzugeben. Wird benötigt wenn eine
der 'Labels' Dijitvarianten spezifiziert wird.
dijit (Optional): Entweder HorizontalRule,
HorizontalRuleLabels, VerticalRule, oder VerticalRuleLabels,
standardmäßig einer der Rule Dijits.
params (optional): Dijit Parameter für die
Konfiguration des Rule Dijits das verwendet wird. Spezifische Parameter
für diese Dijits sind:
container (Optional): Ein Array von
Parametern und Attributen für den Rule Container.
labels (Optional): Ein Array von Parametern
und Attributen für die Labels des Containers.
attribs (Optional): HTML
Attribute die mit den Maßstäben und Labels verwendet werden. Diese
sollten dem Format der params Option folgen und
können ein assoziatives Array mit den Schlüsseln 'container' und
'labels' sein.
horizontalSlider(
'foo',
1,
array(
'minimum' => -10,
'maximum' => 10,
'discreteValues' => 11,
'intermediateChanges' => true,
'showButtons' => true,
'topDecoration' => array(
'container' => 'topContainer'
'dijit' => 'HorizontalRuleLabels',
'labels' => array(
' ',
'20%',
'40%',
'60%',
'80%',
' ',
),
'params' => array(
'container' => array(
'style' => 'height:1.2em; font-size=75%;color:gray;',
),
'labels' => array(
'style' => 'height:1em; font-size=75%;color:gray;',
),
),
),
'bottomDecoration' => array(
'container' => 'bottomContainer'
'labels' => array(
'0%',
'50%',
'100%',
),
'params' => array(
'container' => array(
'style' => 'height:1.2em; font-size=75%;color:gray;',
),
'labels' => array(
'style' => 'height:1em; font-size=75%;color:gray;',
),
),
),
)
);
]]>
NumberSpinner: dijit.form.NumberSpinner.
Eine Textbox für numerische Eingaben mit Buttons für das Inkrementieren und
Dekrementieren.
Erwartet entweder ein Assoziatives Array für den Dijit Parameter 'constraints',
oder einfach die Schlüssel 'min', 'max' und 'places' (das würden auch die
erwarteten Einträge des Constraints Parameters sein). 'places' kann verwendet
werden um anzugeben um wieviel der NumberSpinner erhöht oder erniedrigt wird.
numberSpinner(
'foo',
5,
array(
'min' => -10,
'max' => 10,
'places' => 2,
),
array(
'maxlenth' => 3,
)
);
]]>
NumberTextBox: dijit.form.NumberTextBox.
NumberTextBox bietet die Möglichkeit die Nummerneinträge auf lokalisiertem Weg
zu formatieren und anzuzeigen, optional gegen angegebene Abhängigkeiten.
numberTextBox(
'foo',
5,
array(
'places' => 4,
'type' => 'percent',
),
array(
'maxlength' => 20,
)
);
]]>
PasswordTextBox:
dijit.form.ValidationTextBox bindet eine
Passworteingabe. PasswordTextBox bietet die Möglichkeit Passworteingaben zu
erstellen die das aktuelle Dijitthema verwenden, sowie Clientseitige Prüfungen
erlauben.
passwordTextBox(
'foo',
'',
array(
'required' => true,
),
array(
'maxlength' => 20,
)
);
]]>
RadioButton: dijit.form.RadioButton. Ein
Set von Optionen von denen nur eine ausgewählt werden kann. Dieses Verhalten
entspricht auf jedem Fall dem normaler Radio Buttons, hat aber das Look-and-Feel
das mit dem anderer Dijit konsistent ist.
RadioButton akzeptiert ein optionales fünftes Argument,
$options, ein assoziatives Array von Werte und Label Paaren
das als Radiooptionen verwendet wird. Diese können auch als
$attribs Schlüssel options angegeben
werden.
radioButton(
'foo',
'bar',
array(),
array(),
array(
'foo' => 'Foo',
'bar' => 'Bar',
'baz' => 'Baz',
)
);
]]>
SimpleTextarea:
dijit.form.SimpleTextarea. Diese funktionieren wie normale
Textareas, werden aber gestylt indem das aktuelle dijit Thema verwendet wird. Es
müssen weder die rows noch die columns Attribute spezifiziert werden; verwende
stattdessen ems oder Prozente für die Breite und Höhe.
simpleTextarea(
'foo',
'Bitte ab hier schreiben...',
array(),
array('style' => 'width: 90%; height: 5ems;')
);
]]>
SubmitButton: Ein dijit.form.Button
bindet ein Submit Eingabeelement. Siehe den Button Viewhelfer für weitere
Details; der grundsätzliche Unterschied ist der, das dieser Button ein Formular
übertragen kann.
Textarea: dijit.form.Textarea. Diese
funktionieren wie normale Textareas, ausgenommen das Sie statt dem Setzen einer
Anzahl von Reihen als Benutzertypen expandieren. Die Breite sollte über
Styleeinstellungen spezifiziert werden.
textarea(
'foo',
'Start writing here...',
array(),
array('style' => 'width: 300px;')
);
]]>
TextBox: dijit.form.TextBox. Diese
Element ist primär vorhanden um das übliche Look-and-Feel zwischen den
verschiedenen Dijit Elementen zu bieten, und um die Basisfunktionalität der
anderen von TextBox abgeleiteten Klassen (ValidationTextBox, NumberTextBox,
CurrencyTextBox, DateTextBox, und TimeTextBox) zu bieten.
Übliche Dijitparameter enthalten 'lowercase' (Casten auf lowercase),
'uppercase' (Casten auf UPPERCASE), 'propercase' (Casten auf
ProperCase), und 'trim' (entferne führende und schließende Leerezeichen); alle
akzeptieren boolsche Werte. Zusätzlich kann es gewünscht sein die Parameter
'size' und 'maxLength' zu spezifizieren.
textBox(
'foo',
'Irgendein Text',
array(
'trim' => true,
'propercase' => true,
'maxLength' => 20,
),
array(
'size' => 20,
)
);
]]>
TimeTextBox: dijit.form.TimeTextBox.
Auch aus der TextBox Familie, bietet TimeTextBox eine Drop Down Auswahl für
Zeiten die verschiebbar ist und die vom Benutzer ausgewählt werden kann. Dijit
Parameter erlaubes es die Zeit zu spezifizieren die im Select vorhanden ist
sowie auch den sichtbaren Bereich der Zeiten.
timeTextBox(
'foo',
'',
array(
'am.pm' => true,
'visibleIncrement' => 'T00:05:00', // 5-Minuten addieren
'visibleRange' => 'T02:00:00', // Zeigt 2 Stunden die hinzugefügt werden können
),
array(
'size' => 20,
)
);
]]>
ValidationTextBox:
dijit.form.ValidateTextBox. Bietet Client-seitige Prüfungen
für Textelemente. Ist von TextBox abgeleitet.
Übliche Dijit Parameter enthalten:
invalidMessage: Eine Nachricht die angezeigt wird
wenn eine ungültige Eingabe erkannt wurde.
promptMessage: Eine Tooltip Hilfenachricht die
verwendet wird.
regExp: Ein regulärer Ausdruck der für die Prüfung
des Textes verwendet wird. Reguläre Ausdrücke benötigen keine
Begrenzungen.
required: Ob das Element benötigt wird oder nicht.
Wenn das der Fall ist, und das Element in einem
dijit.form.Form eingebettet ist, wird es als ungültig
markiert und die Übertragung verhindert.
validationTextBox(
'foo',
'',
array(
'required' => true,
'regExp' => '[\w]+',
'invalidMessage' => 'Keine Leerzeichen oder nicht-Wort Zeichen erlaubt',
'promptMessage' => 'Nur ein einzelnes Wort das aus ' .
'alphanumerischen Zeichen und Unterstrichen besteht',
),
array(
'maxlength' => 20,
)
);
]]>
Eigene Dijits
Wenn man viel in Dojo herumtaucht, wird man sehr bald selbst eigene Dijits schreiben,
oder experimentelle Dijits von Dojox verwenden. Wärend Zend Framework nicht jeden Dijit
direkt unterstützen kann, bietet es einiges an direkter rudimentärer Unterstützung für
jeden Dijit, und es bietet einiges an rudimentärer Unterstützung für beliebige Dijit
Typen über den CustomDijit View Helfer.
Die API des CustomDijit View Helfers ist
genauso wie die jedes anderen Dijits, mit einem grundsätzlichen Unterschied: Das dritten
"params" Argument muss das Attribut "dojotype" enthalten. Der Wert
dieses Attributs sollte die Dijit Klasse sein die man verwenden will.
CustomDijit erweitert den Basis
DijitContainer View Helfer, welches er erlaubt Inhalte zu fangen
(durch Verwendung der captureStart() und
captureEnd() Methodenpaare).
captureStart() erwartet auch das man das "dojoType" Attribut
als sein "params" Argument übergibt.
Verwendung von CustomDijit um ein dojox.layout.ContentPane darzustellen
dojox.layout.ContentPane ist eine Next-Generation Erweiterung von
dijit.layout.ContentPane und bietet ein Superset der
Möglichkeiten dieser Klasse. Bis seine Funktionalitäten stabil sind, wird es
weiterhin in Dojox leben. Wenn man es trotzdem im heutigen Zend Framework verwenden
will, kann man den CustomDijit View Helfer verwenden.
Grundsätzlich kann man das folgende tun:
customDijit(
'foo',
$content,
array(
'dojoType' => 'dojox.layout.ContentPane',
'title' => 'Eigene Ebene',
'region' => 'center'
)
); ?>
]]>
Wenn man stattdessen Inhalte fangen will, sollte einfach die
captureStart() Methode verwendet, und der "dojoType" als
"params" Argument übergeben werden:
customDijit()->captureStart(
'foo',
array(
'dojoType' => 'dojox.layout.ContentPane',
'title' => 'Eigene Ebene',
'region' => 'center'
)
); ?>
Das ist der Inhalt der Ebene
customDijit()->captureEnd('foo'); ?>
]]>
Man kann CustomDijit auch einfach erweitern um Unterstützung
für eigene Dijits zu bieten. Wenn man, als Beispiel,
dijit.layout.ContentPane erweitern will um eine eigene
foo.ContentPane Klasse zu erstellen, kann man den folgenden
Helfer erstellen um Ihn zu unterstützen:
customDijit($id, $value, $params, $attribs);
}
}
]]>
Solange der eigene Dijit der gleichen grundsätzlichen API wie
offizielle Dijits folgt, sollte die Verwendung oder Erweiterung von
CustomDijit korrekt funktionieren.