Home > Article > Backend Development > Yii Framework Official Guide Series 19 - Using Forms: Creating Forms
Writing the login view is very simple. We start with a form tag, and its action attribute should be the URL of the login action described earlier. Then we need to insert labels and form fields for the properties declared in the LoginForm class. Finally, we insert a submit button that the user can click to submit the form. All of this can be done with pure HTML code.
Yii provides several helper classes to simplify view writing. For example, to create a text input field, we can call CHtml::textField(); to create a drop-down list, call CHtml::dropDownList().
Information: You may be wondering about the benefits of using helpers if they require the same amount of code as writing pure HTML directly. The answer is that helpers can provide more functionality than HTML code. For example, the following code will generate a text input field that triggers a form submission action when the user modifies its value.
CHtml::textField($name,$value,array('submit'=>''));
Otherwise you need Write a bunch of JavaScript.
Below, we use CHtml to create a login form. We assume that the variable $model is an instance of LoginForm.
<p> <?php echo CHtml::beginForm(); ?> <?php echo CHtml::errorSummary($model); ?> </p><p> <?php echo CHtml::activeLabel($model,'username'); ?> <?php echo CHtml::activeTextField($model,'username') ?> </p> <p> <?php echo CHtml::activeLabel($model,'password'); ?> <?php echo CHtml::activePasswordField($model,'password') ?> </p> <p> <?php echo CHtml::activeCheckBox($model,'rememberMe'); ?> <?php echo CHtml::activeLabel($model,'rememberMe'); ?> </p> <p> <?php echo CHtml::submitButton('Login'); ?> </p> <?php echo CHtml::endForm(); ?> <!-- form -->
The above code generates a more dynamic form, for example, CHtml::activeLabel() generates a form with the specified Labels related to the model's features. If there is a typographical error in this attribute, the label's CSS class will become error , changing the label's appearance through CSS styling. Similarly, CHtml::activeTextField() generates a text input field for the specified model's properties and changes its CSS class when an error occurs.
If we use the CSS style file provided by yiic scripter, the generated form will look like this:
##From version 1.1. 1 Starting from now, a new widget CActiveForm is provided to simplify form creation. This little widget provides seamless, consistent validation on both the client and server sides. Using CActiveForm, the above code can be rewritten as:<p class="form"> <?php $form=$this->beginWidget('CActiveForm'); ?> <?php echo $form->errorSummary($model); ?> <p class="row"> <?php echo $form->label($model,'username'); ?> <?php echo $form->textField($model,'username') ?> </p> <p class="row"> <?php echo $form->label($model,'password'); ?> <?php echo $form->passwordField($model,'password') ?> </p> <p class="row rememberMe"> <?php echo $form->checkBox($model,'rememberMe'); ?> <?php echo $form->label($model,'rememberMe'); ?> </p> <p class="row submit"> <?php echo CHtml::submitButton('Login'); ?> </p> <?php $this->endWidget(); ?> </p><!-- form -->