Commit 237bd24f by Nobuo Kihara

docs/guide-ja/start-forms.md - revised [ci skip]

parent 2c698f13
フォームを扱う フォームを扱う
============== ==============
この節では、ユーザからデータを取得するフォームを持つ新しいページを作る方法を説明します。 この節では、ユーザからデータを取得するためのフォームを持つ新しいページを作る方法を説明します。
このページは名前の入力フィールドとメールの入力フィールドを持つフォームを表示します。 このページは名前の入力フィールドとメールの入力フィールドを持つフォームを表示します。
ユーザからこれら二つの情報を受け取った後、ページは確認のために入力された値をエコーバックします。 ユーザからこれら二つの情報を受け取った後、ページは入力された値を確認のためにエコーバックします。
この目的を達するために、一つの [アクション](structure-controllers.md) と 二つの [ビュー](structure-views.md) を作成する以外に、 この目的を達するために、一つの [アクション](structure-controllers.md) と 二つの [ビュー](structure-views.md) を作成する以外に、
一つの [モデル](structure-models.md) をも作成します。 一つの [モデル](structure-models.md) をも作成します。
このチュートリアルを通じて、次のことをする方法を学びます: このチュートリアルを通じて、次の方法を学びます。
* フォームを通じてユーザが入力したデータを表す [モデル](structure-models.md) を作成する * フォームを通じてユーザによって入力されるデータを表す [モデル](structure-models.md) を作成する方法
* 入力されたデータを検証する規則を宣言する * 入力されたデータを検証する規則を宣言する方法
* [ビュー](structure-views.md) の中で HTML フォームを構築する * [ビュー](structure-views.md) の中で HTML フォームを構築する方法
モデルを作成する<a name="creating-model"></a> モデルを作成する<a name="creating-model"></a>
---------------- ----------------
ユーザからの入力を要求するデータは下に示されているように `EntryForm` モデルクラスとして表現され、`models/EntryForm.php` というファイルに保存されます。 ユーザに入力してもらうデータは、下に示されているように `EntryForm` モデルクラスとして表現され、`models/EntryForm.php` というファイルに保存されます。
クラスファイルの命名規約についての詳細は [クラスのオートロード](concept-autoloading.md) の節を参照してください。 クラスファイルの命名規約についての詳細は [クラスのオートロード](concept-autoloading.md) の節を参照してください。
```php ```php
...@@ -49,15 +49,15 @@ class EntryForm extends Model ...@@ -49,15 +49,15 @@ class EntryForm extends Model
> Info|情報: [[yii\base\Model]] はデータベーステーブルと関連*しない*モデルクラスの親として使われます。 > Info|情報: [[yii\base\Model]] はデータベーステーブルと関連*しない*モデルクラスの親として使われます。
データベーステーブルと対応するモデルクラスでは、通常は [[yii\db\ActiveRecord]] が親になります。 データベーステーブルと対応するモデルクラスでは、通常は [[yii\db\ActiveRecord]] が親になります。
`EntryForm` クラスは二つのパブリックメンバー、`name``email` を持っており、これらがユーザによって入力されたデータを保管するのに使われます。 `EntryForm` クラスは二つのパブリックメンバー、`name``email` を持っており、これらがユーザによって入力されるデータを保管するのに使われます。
このクラスはまた `rules()` という名前のメソッドを持っています。このメソッドがデータを検証する一連の規則を返します。 このクラスはまた `rules()` という名前のメソッドを持っています。このメソッドがデータを検証する一連の規則を返します。
上記で宣言されている検証規則は次のことを述べています: 上記で宣言されている検証規則は次のことを述べています。
* `name``email` は、ともに値を要求される * `name``email` は、ともに値を要求される
* `email` のデータは構文的に正当なメールアドレスでなければならない * `email` のデータは構文的に正当なメールアドレスでなければならない
`EntryForm` オブジェクトにユーザが入力したデータを投入した後、[[yii\base\Model::validate()|validate()]] を呼んでデータ検証ルーチンを始動することが出来ます。 ユーザによって入力されたデータを `EntryForm` オブジェクトに投入した後、[[yii\base\Model::validate()|validate()]] を呼んでデータ検証ルーチンを始動することが出来ます。
データ検証が失敗すると [[yii\base\Model::hasErrors|hasErrors]] プロパティが true に設定され、 データ検証が失敗すると [[yii\base\Model::hasErrors|hasErrors]] プロパティが true に設定されます。
そして、[[yii\base\Model::getErrors|errors]] を通じて、どのような検証エラーが発生したかを知ることが出来ます。 そして、[[yii\base\Model::getErrors|errors]] を通じて、どのような検証エラーが発生したかを知ることが出来ます。
...@@ -99,32 +99,33 @@ class SiteController extends Controller ...@@ -99,32 +99,33 @@ class SiteController extends Controller
$model = new EntryForm; $model = new EntryForm;
if ($model->load(Yii::$app->request->post()) && $model->validate()) { if ($model->load(Yii::$app->request->post()) && $model->validate()) {
// $model に受け取ったデータを検証する // $model に有効なデータを受け取った場合
// ここで $model について意味のあることを何かする ... // ここで $model について何か意味のあることをする ...
return $this->render('entry-confirm', ['model' => $model]); return $this->render('entry-confirm', ['model' => $model]);
} else { } else {
// ページの初期表示か、または、何か検証エラーがある // ページの初期表示か、または、何か検証エラーがある場合
return $this->render('entry', ['model' => $model]); return $this->render('entry', ['model' => $model]);
} }
} }
} }
``` ```
アクションは最初に `EntryForm` オブジェクトを生成します。そして、次に、モデルに `$_POST` のデータ、 アクションは最初に `EntryForm` オブジェクトを生成します。そして、次に、モデルに `$_POST` のデータ、Yii においては [[yii\web\Request::post()]]
Yii においては [[yii\web\Request::post()]] によって提供されるデータを投入しようと試みます。 によって提供されるデータを投入しようと試みます。
モデルへのデータ投入が成功した場合(つまり、ユーザが HTML フォームを送信した場合)、アクションは モデルへのデータ投入が成功した場合(つまり、ユーザが HTML フォームを送信した場合)、アクションは[[yii\base\Model::validate()|validate()]]
[[yii\base\Model::validate()|validate()]] を呼んで、入力された値が有効なものであることを確認します。 を呼んで、入力された値が有効なものであることを確認します。
> Info|情報: `Yii::$app` という式は [アプリケーション](structure-applications.md) インスタンスを表現します。 > Info|情報: `Yii::$app` という式は [アプリケーション](structure-applications.md) インスタンスを表現します。
これはグローバルにアクセス可能なシングルトンです。これは、また、特定の機能性をサポートする `request` これはグローバルにアクセス可能なシングルトンです。
`response`, `db` などのコンポーネントを提供する [サービスロケータ](concept-service-locator.md) でもあります。 これは、また、特定の機能性をサポートする `request``response``db` などのコンポーネントを提供する
上記のコードでは、アプリケーションインスタンスの`request` コンポーネントが `$_POST` データにアクセスするために使われています。 [サービスロケータ](concept-service-locator.md) でもあります。
上記のコードでは、アプリケーションインスタンスの `request` コンポーネントが `$_POST` データにアクセスするために使われています。
すべてが適正である場合、アクションは `entry-confirm` という名前のビューを表示して、データの送信が成功したことをユーザに確認させます。 すべてが適正である場合、アクションは `entry-confirm` という名前のビューを表示して、データの送信が成功したことをユーザに確認させます。
データが送信されなかったり、データがエラーを含んでいたりする場合は、`entry` ビューが表示され、その中で HTML フォームが データが送信されなかったり、データがエラーを含んでいたりする場合は、`entry` ビューが表示され、その中で HTML フォームが
(もし有れば)検証エラーのメッセージとともに表示されます。 (もし有れば) 検証エラーのメッセージとともに表示されます。
> Note|注意: この簡単な例では、有効なデータ送信に対して単純に確認ページを表示しています。実際の仕事では、 > Note|注意: この簡単な例では、有効なデータ送信に対して単純に確認ページを表示しています。実際の仕事では、
[フォーム送信の諸問題](http://en.wikipedia.org/wiki/Post/Redirect/Get) を避けるために、 [フォーム送信の諸問題](http://en.wikipedia.org/wiki/Post/Redirect/Get) を避けるために、
...@@ -143,7 +144,7 @@ Yii 縺ォ縺翫>縺ヲ縺ッ [[yii\web\Request::post()]] 縺ォ繧医▲縺ヲ謠蝉セ帙&繧後k繝 ...@@ -143,7 +144,7 @@ Yii 縺ォ縺翫>縺ヲ縺ッ [[yii\web\Request::post()]] 縺ォ繧医▲縺ヲ謠蝉セ帙&繧後k繝
<?php <?php
use yii\helpers\Html; use yii\helpers\Html;
?> ?>
<p>あなたは次の情報を入力しました:</p> <p>あなたは次の情報を入力しました</p>
<ul> <ul>
<li><label>名前</label>: <?= Html::encode($model->name) ?></li> <li><label>名前</label>: <?= Html::encode($model->name) ?></li>
...@@ -190,7 +191,7 @@ http://hostname/index.php?r=site/entry ...@@ -190,7 +191,7 @@ http://hostname/index.php?r=site/entry
二つの入力フィールドを持つフォームを表示するページが表示されるでしょう。 二つの入力フィールドを持つフォームを表示するページが表示されるでしょう。
それぞれの入力フィールドの前には、どんなデータを入力すべきかを示すラベルがあります。 それぞれの入力フィールドの前には、どんなデータを入力すべきかを示すラベルがあります。
何も入力せずに、あるいは、無効なメールアドレスを入力して送信ボタンをクリックすると、 何も入力せずに、あるいは、無効なメールアドレスを入力して送信ボタンをクリックすると、
それぞれ問題のある入力フィールドの続きにエラーメッセージが表示されます。 それぞれ問題のある入力フィールドの後ろにエラーメッセージが表示されます。
![検証エラーのあるフォーム](images/start-form-validation.png) ![検証エラーのあるフォーム](images/start-form-validation.png)
...@@ -201,13 +202,11 @@ http://hostname/index.php?r=site/entry ...@@ -201,13 +202,11 @@ http://hostname/index.php?r=site/entry
### 魔法の説明<a name="magic-explained"></a> ### 魔法の説明<a name="magic-explained"></a>
あなたは、舞台裏で HTML フォームがどのように動いているのか、不思議に思うかも知れません。なぜなら、 あなたは、舞台裏で HTML フォームがどのように動いているのか、不思議に思うかも知れません。
フォームが、ほとんど魔法のように、各入力フィールドのラベルを表示し、データを正しく入力しない場合には なぜなら、フォームが、ほとんど魔法のように、各入力フィールドのラベルを表示し、データを正しく入力しなかった場合には、ページをリロードすることなく、エラーメッセージを表示するからです。
ページをリロードすることなくエラーメッセージを表示するからです。
そう、データの検証は、最初に JavaScript を使ってクライアントサイドで実行され、次に PHP によってサーバーサイドで実行されます。 そう、データの検証は、最初に JavaScript を使ってクライアントサイドで実行され、次に PHP によってサーバーサイドで実行されます。
[[yii\widgets\ActiveForm]] は、賢いことに、`EntryForm` で宣言した検証規則を抽出し、それを実行可能な JavaScript コードに変換して、 [[yii\widgets\ActiveForm]] は、賢いことに、`EntryForm` で宣言した検証規則を抽出し、それを実行可能な JavaScript コードに変換して、JavaScript を使ってデータ検証を実行します。
JavaScript を使ってデータ検証を実行します。
ブラウザで JavaScript を無効にした場合でも、`actionEntry()` メソッドで示されているように、サーバーサイドでの検証は実行されます。 ブラウザで JavaScript を無効にした場合でも、`actionEntry()` メソッドで示されているように、サーバーサイドでの検証は実行されます。
これにより、どのような状況であっても、データの有効性が保証されます。 これにより、どのような状況であっても、データの有効性が保証されます。
...@@ -217,7 +216,7 @@ JavaScript 繧剃スソ縺」縺ヲ繝繧ソ讀懆ィシ繧貞ョ溯。後@縺セ縺吶 ...@@ -217,7 +216,7 @@ JavaScript 繧剃スソ縺」縺ヲ繝繧ソ讀懆ィシ繧貞ョ溯。後@縺セ縺吶
入力フィールドのラベルは、モデルのプロパティ名を使用して、`field()` メソッドによって生成されます。 入力フィールドのラベルは、モデルのプロパティ名を使用して、`field()` メソッドによって生成されます。
例えば、`name` というプロパティから `Name` というラベルが生成されます。 例えば、`name` というプロパティから `Name` というラベルが生成されます。
ビューの中で、下記のコードのように、ラベルをカスタマイズすることも出来ます: ビューの中で、下記のコードのように、ラベルをカスタマイズすることも出来ます。
```php ```php
<?= $form->field($model, 'name')->label('お名前') ?> <?= $form->field($model, 'name')->label('お名前') ?>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment