Der login
-View ist schnell erstellt. Man beginnt mit dem form
Tag,
dessen action-Attribut die URL der eben beschriebenen login
-Action enthält.
Dann werden Label und Eingabefelder für alle Attribute der LoginForm
-Klasse
hinzugefügt. Ein Absendebutton schließt das Formular ab. All das lässt sich
mit reinem HTML-Code bewerkstelligen.
Yii bietet allerdings auch einige nützliche Hilfsklassen für das Erstellen von Views an. Textfelder kann man z.B. mit CHtml::textField() erzeugen, Auswahllisten mit CHtml::dropDownList().
Info: Vielleicht fragen Sie sich, wo der Sinn dieser Helfer liegt, wo man doch fast genausoviel Text schreiben muss, wie der erzeugte HTML-Code. Die Helfer leisten aber mehr als das. Mit folgendem Beispiel kann man z.B. ein Textfeld erstellen, dessen Formular automatisch abgesendet wird, sobald sein Inhalt verändert wird.
CHtml::textField($name,$value,array('submit'=>''));
Ohne Helferklasse müsste man überall umständlich Javascriptcode einfügen.
Im folgenden Beispiel zeigen wir, wie man das Anmeldeformular mit Hilfe von CHtml
erstellt. Die Variable $model
soll hierbei ein LoginForm
-Model enthalten.
<div class="form"> echo CHtml::beginForm(); echo CHtml::errorSummary($model); <div class="row"> echo CHtml::activeLabel($model,'username'); echo CHtml::activeTextField($model,'username') </div> <div class="row"> echo CHtml::activeLabel($model,'password'); echo CHtml::activePasswordField($model,'password') </div> <div class="row rememberMe"> echo CHtml::activeCheckBox($model,'rememberMe'); echo CHtml::activeLabel($model,'rememberMe'); </div> <div class="row submit"> echo CHtml::submitButton('Login'); </div> echo CHtml::endForm(); </div><!-- form -->
Damit wird ein dynamisches Formular erzeugt. CHtml::activeLabel()
generiert zum Beispiel ein Label für das angegebene Modelattribut.
Tritt bei diesem Attribut ein Eingabefehler auf, erhält das Label die
zusätzliche CSS-Klasse error
. Über entsprechende CSS-Stile ändert sich so
bei fehlerhaften Eingaben die Formatierung des Labels. Das selbe gilt für Textfelder
die mit CHtml::activeTextField() generiert wurden.
Wenn man die vom yiic
-Befehl angelegte CSS-Datei form.css
verwendet,
sieht das erzeugte Formular folgendermaßen aus:
Die Anmeldeseite
Die Anmeldeseite mit Fehlern
Seit Version 1.1.1 kann man Formulare auch mit dem neuen CActiveForm-Widget erstellen. Damit wird es möglich, eine einheitliche Validierung wahlweise auf Client- oder auf Serverseite durchzuführen. Mit CActiveForm wird der obige Code dann zu:
<div class="form"> $form=$this->beginWidget('CActiveForm'); echo $form->errorSummary($model); <div class="row"> echo $form->label($model,'username'); echo $form->textField($model,'username') </div> <div class="row"> echo $form->label($model,'password'); echo $form->passwordField($model,'password') </div> <div class="row rememberMe"> echo $form->checkBox($model,'rememberMe'); echo $form->label($model,'rememberMe'); </div> <div class="row submit"> echo CHtml::submitButton('Login'); </div> $this->endWidget(); </div><!-- form -->
Found a typo or you think this page needs improvement?
Edit it on github !
Signup or Login in order to comment.