Friction River Software - CakePHP5入門【CakePHP5基礎編④】フォーム送信

Ｂ美

今回は、Webアプリケーションでは必須知識となる「フォーム送信」についてよ

Ｃ菜

「ユーザID」や「パスワード」を入力してから「ログイン」ボタンを押すことで、Webサーバへユーザ認証のための情報を送ったりするやつですね～？

Ａ子

5chチャンネルなんかの掲示板でもよく使ってるよね

Ｂ美

「CakePHP」にはHelperヘルパーという仕組みがあって、HTMLタグを知らなくてもフォームを作れるの

それでは、まずはViewビューファイルを編集していきましょう
（前回の「testapp/templates/PostTest/index.php」を書き換えます）

<?= $this->Form->create(null, ['id' => 'test_form', 'url' => ['controller' => 'PostTest', 'action' => 'send']]) ?>
　　<?= $this->Form->textarea('textfield', array('id' => 'textfield', 'label' => false, 'div' => false, 'style' => 'width: 500px;height: 300px;resize: none;')) ?>
　　 
　　<?= $this->Form->button(__('送信'), ['type' => 'submit', 'id' => 'submit_btn']) ?>
<?= $this->Form->end() ?>

ちょっと長いけど頑張って入力してね
（コピペでも良いけど…）

Ｃ菜

複数行入力できるテキストエリアってやつですね～

あ、「testapp/src/Controller/PostTestController.php」の書き換えは良いんですか～？

Ｂ美

もちろん必要よ

まずは前回使った「index」メソッドだけど、別にそのままでも良いわ
んで、フォームの送信先である「send」メソッドを新たに作ります

public function send()
{
　　$res = "";

　　if ($this->request->is('post')) {
　　　　$textfield = $this->request->getData('textfield');
　　　　$res = nl2br(htmlspecialchars($textfield, ENT_QUOTES));
　　}

　　$this->set('result', $res);
}

・もしも（GETリクエストではなく）POST送信であれば、「textfield」という名前で送られてきたデータを取得し、それをサニタイズ及び改行コードのbrタグ変換を行ってから変数$resに代入する
・それを「result」という名前でビューへ受け渡す
…って意味ね

Ｃ菜

複数行入力のテキストエリアじゃなくて、パスワード入力みたいな一行入力だったり、あとラジオボタンやチェックボックスの場合はどうなるんですか～？

Ｂ美

フォームの要素が何であろうと、「$this->request->getData('○○')」という形で受け取れるわよ

あ、あとフォームのmethodが「POST」であることを指定してないけど、「'type' => 'get'」を指定しない限り、自動的にPOST送信になるわね

Ａ子

結果を表示するためには「send.php」というViewビューファイルも要るんじゃないの？

Ｂ美

もちろん！

「testapp/templates/PostTest」の中に空のファイルとして「send.php」を作ってね
その内容としては、タイトル（【送信データ】ってやつ）とControllerコントローラーから渡された値（$result）を表示するコードだけで良いでしょう

【送信データ】
 
<?= $result ?>

Ｂ美

さて、それでは動作確認してみるわね
（プログラマとしては最もワクワクする瞬間よ）

これはテストです。
これは2行目です。
不等号「<」と「>」を表示できるか試してみます。

…って入力してみましょう
（入力する文字は別に何でも良いんだけど…）

Ｂ美

んで、「送信」ボタンを押すと…

下の赤色で囲んだところが結果表示の箇所になります

Ｃ菜

すごいです～

感動です～

Ａ子

なんかあっさり成功したね

プログラムって、意外と簡単なんじゃないか…って錯覚しちゃいそう（苦笑）

Ｂ美

いや実際、簡単よ
（特にWebフレームワークを利用するのなら…）

結局のところプログラミングって…
「多くの成功パターンを積み重ねていけば、あとはそれをコピペしていけば良いだけ」なのよね
（要するに、それらのパターンを暗記する必要は無いってこと）

Ａ子

ん？
「index.php」のフォーム生成の記法とか、「send」メソッド内の書き方とかって、もしかしてコピペ？

Ｂ美

あったりまえじゃん！

憶えてるわけないっつーの

Ｃ菜

そんなものなんですね～

Ｂ美

そんなものよ！

あと、参考までにほかのフォーム部品も示しておくわね
（注：ファイルをアップロードしたいときは、「Form->create」に「'type' => 'file'」が必要）

<?= $this->Form->create(null, ['id' => 'test_form', 'type' => 'file', 'url' => ['controller' => 'PostTest', 'action' => 'send']]) ?>
　　<?= $this->Form->textarea('textfield', array('id' => 'textfield', 'label' => false, 'div' => false, 'style' => 'width: 500px;height: 300px;resize: none;')) ?>

　　 
　　一行入力：<?= $this->Form->text('text01', ['label' => false, 'div' => false]) ?>
　　 
　　パスワード：<?= $this->Form->password('password02', ['label' => false, 'div' => false]) ?>
　　 
　　ラジオボタン：<?= $this->Form->radio('radio03', ['value1' => 'Ａ子', 'value2' => 'Ｂ美', 'value3' => 'Ｃ菜'], ['value' => 'value1']) ?>
　　 
　　<?= $this->Form->checkbox('check04', ['checked' => true]) ?>チェックボックス
　　 
　　セレクトボックス：<?= $this->Form->select('select05',['Ａ子', 'Ｂ美', 'Ｃ菜']) ?>
　　 
　　ファイル：<?= $this->Form->file('file06', ['label' => false, 'div' => false]) ?>
　　 

　　日付入力：<?= $this->Form->date('date07', ['label' => false, 'div' => false]) ?>
　　 
　　時間入力：<?= $this->Form->time('time08', ['label' => false, 'div' => false]) ?>
　　 
　　日付及び時間入力：<?= $this->Form->datetime('datetime09', ['label' => false, 'div' => false]) ?>
　　 
　　数値入力：<?= $this->Form->control('number10', ['type' => 'number', 'label' => false, 'div' => false, 'min' => 50, 'max' => 300, 'value' => 100]) ?>
　　 
　　メールアドレス：<?= $this->Form->control('email11', ['type' => 'email', 'label' => false, 'div' => false]) ?>
　　 
　　色指定：<?= $this->Form->control('color12', ['type' => 'color', 'label' => false, 'div' => false]) ?>
　　 

　　<?= $this->Form->button(__('送信'), ['type' => 'submit', 'id' => 'submit_btn']) ?>
　　<?= $this->Form->button(__('リセット'), ['type' => 'reset', 'id' => 'reset_btn']) ?>
<?= $this->Form->end() ?>