mirror of
https://github.com/yiisoft/yii.git
synced 2026-03-12 11:06:54 +01:00
100 lines
4.4 KiB
Plaintext
100 lines
4.4 KiB
Plaintext
フォームの作成
|
|
=============
|
|
|
|
`login` ビューを書くのは簡単な事です。
|
|
始めに、先ほど述べた `login` アクションのURLを action 属性とする `form` タグを書きます。
|
|
次に `LoginForm` クラスで定義された属性のためのラベルと入力フィールドを挿入します。
|
|
最後にユーザがクリックしてフォームの内容を送信するための送信ボタンを挿入します。
|
|
これらは全て、純粋な HTML コードで書くことが出来ます。
|
|
|
|
Yii はビューの作成を手助けするいくつかのヘルパークラスを提供します。
|
|
例えば、テキスト入力フィールドを作成するために、[CHtml::textField()] をコールする事が出来ます。また、ドロップダウンリストの作成のためには、[CHtml::dropDownList()] をコールできます。
|
|
|
|
> Info|情報: 素の HTML コードと比べて、同じような量のコードが必要なら、ヘルパーを使う事に何の利益があるのかと不思議に思うかも知れません。
|
|
>それに対する回答は、ヘルパーは、ただの HTML コードよりも多くの機能を提供すると言う事です。
|
|
>例えば下記のコードは、ユーザが値を変更した時に送信をトリガーする事が可能なテキスト入力フィールドを生成します。
|
|
> ~~~
|
|
> [php]
|
|
> CHtml::textField($name,$value,array('submit'=>''));
|
|
> ~~~
|
|
> このヘルパーが無ければ、ごちゃごちゃした JavaScript をいたる所に書く必要があるでしょう。
|
|
|
|
|
|
下記では [CHtml] をログインフォームの作成に使用しています。
|
|
ここで `$model` という変数は `LoginForm` のインスタンスを表していると仮定します。
|
|
|
|
~~~
|
|
[php]
|
|
<div class="form">
|
|
<?php echo CHtml::beginForm(); ?>
|
|
|
|
<?php echo CHtml::errorSummary($model); ?>
|
|
|
|
<div class="row">
|
|
<?php echo CHtml::activeLabel($model,'username'); ?>
|
|
<?php echo CHtml::activeTextField($model,'username') ?>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<?php echo CHtml::activeLabel($model,'password'); ?>
|
|
<?php echo CHtml::activePasswordField($model,'password') ?>
|
|
</div>
|
|
|
|
<div class="row rememberMe">
|
|
<?php echo CHtml::activeCheckBox($model,'rememberMe'); ?>
|
|
<?php echo CHtml::activeLabel($model,'rememberMe'); ?>
|
|
</div>
|
|
|
|
<div class="row submit">
|
|
<?php echo CHtml::submitButton('Login'); ?>
|
|
</div>
|
|
|
|
<?php echo CHtml::endForm(); ?>
|
|
</div><!-- form -->
|
|
~~~
|
|
|
|
上記のコードは、よりダイナミックなフォームを生成します。
|
|
例えば、[CHtml::activeLabel()] は特定のモデル属性と関連付けられたラベルを生成します。
|
|
もし属性が入力エラーを持っていた場合は、ラベルの CSS クラスは `error` に変更され、適切な CSS スタイルによってラベルの外観が変更されるでしょう。
|
|
同様に、[CHtml::activeTextField()] は指定されたモデル属性のためのテキスト入力フィールドを生成し、何らかの入力エラーがある場合に、その CSS クラスを変更します。
|
|
|
|
`yiic` スクリプトで供給される `form.css` という CSS スタイルファイルを使用した場合は、生成されるフォームは下記の様になるでしょう:
|
|
|
|
|
|
|
|
|
|
|
|
バージョン 1.1.1 以降、[CActiveForm] と呼ばれる新しいウィジェットが提供されて、フォーム作成がさらに容易になりました。
|
|
このウィジェットは、クライアントとサーバの両サイドで継ぎ目のない一貫した検証をサポートすることが出来ます。
|
|
[CActiveForm] を使うと、上記のビューのコードは下記のように書き換えることが出来ます。
|
|
|
|
~~~
|
|
[php]
|
|
<div class="form">
|
|
<?php $form=$this->beginWidget('CActiveForm'); ?>
|
|
|
|
<?php echo $form->errorSummary($model); ?>
|
|
|
|
<div class="row">
|
|
<?php echo $form->label($model,'username'); ?>
|
|
<?php echo $form->textField($model,'username') ?>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<?php echo $form->label($model,'password'); ?>
|
|
<?php echo $form->passwordField($model,'password') ?>
|
|
</div>
|
|
|
|
<div class="row rememberMe">
|
|
<?php echo $form->checkBox($model,'rememberMe'); ?>
|
|
<?php echo $form->label($model,'rememberMe'); ?>
|
|
</div>
|
|
|
|
<div class="row submit">
|
|
<?php echo CHtml::submitButton('Login'); ?>
|
|
</div>
|
|
|
|
<?php $this->endWidget(); ?>
|
|
</div><!-- form -->
|
|
~~~
|
|
<div class="revision">$Id$</div> |