CakePHPで高速Webアプリ開発

第6回 CakePHPで作るToDoアプリ(2)

この記事を読むのに必要な時間:およそ 3 分

第5回ではテストデータの表示までが完了しました。今回はタスクの追加機能を実装します。

実装においては,作業上のデメリットの発生やセキュリティ問題などを引き起こさないように配慮したコードにしました。その代償として他のチュートリアルに比べて比較的複雑になっていますが,より実践的なサンプルとして扱えると思います。

入力フォームを作る

まずは入力フォームです。app/views/tasks/index.thtmlを書き換えて,ToDo一覧ページにフォームを設置します。リスト1の赤字の部分が追記されたコードになります。

リスト1 app/views/tasks/index.thtml

<form action="<?php echo h($html->url('/tasks/add')) ?>" method="post" style="margin-bottom:1em">
<p><?php echo $html->input('Task/content') ?>
<?php echo $html->submit('タスクを追加') ?></p>
</form>

<table>
<tr>
<th>Id</th>
<th>タスク内容</th>
<th>状態</th>
<th>作成日</th>
</tr>
<?php foreach ($tasks as $task) { ?>
<tr>
<td><?php echo h($task['Task']['id']) ?></td>
<td><?php echo h($task['Task']['content']) ?></td>
<td><?php echo h($task['Task']['status']) ?></td>
<td><?php echo h($task['Task']['created']) ?></td>
</tr>
<?php } ?>
</table>

見慣れないコードが沢山出てきましたが,頻繁に使うことになる類のコードですのでしっかり追っていきます。まずはform要素の開始タグです。

form要素の開始タグと,formTagメソッドにまつわるあれこれ

<form action="<?php echo h($html->url('/tasks/add')) ?>" method="post" style="margin-bottom:1em">

$htmlはHTMLヘルパーのオブジェクトです。読み込むヘルパーをコントローラ内で指定していなければ,HTMLヘルパーは自動で読み込まれます。

HTMLヘルパーのurlメソッドは,CakePHPアプリケーションのURLを,CakePHPを設置したディレクトリに応じて書き換えて返してくれるメソッドです。このメソッドを通してURLを記述しておくことで,Webサーバーのどのディレクトリにアプリケーションを配置しても正しくリンクがつながります。

form要素のaction属性においても同じことが言えますので,使用しています。第4回でセットアップした環境でこのコード動作させた場合,action属性の値は「/~gihyo/todo/tasks/add」となります。

method属性はHTTPのPOSTメソッドで送信することを明示しています。style属性にはフォーム下の表との間隔をとって見栄えを良くするために1文字ぶんのマージン(間隔)を設定するスタイルシートを記述しています。

ここではform要素のaction属性のみHTMLヘルパーで記述しましたが,実はHTMLヘルパーにはform要素の開始タグそのものを出力するformTagメソッドがあります。CakePHP的にはformTagメソッドを使用したほうがいいのかもしれませんが,1.1のHTMLヘルパーには開始タグを出力するメソッドはあれど閉じタグを出力するメソッドがありません。閉じタグはそのままHTMLとして「</form>」と記述することになるのですが,この書き方を行うとDreamweaverなどのWYSIWYGエディタでこのビューファイルを開いたときにエディタ上のレイアウトが大きく崩れることがあります。

form要素の開始タグのみヘルパーで書かれているため,エディタがform要素を認識できないからです。認識できないだけなら良いのですが中途半端な閉じタグが存在していると自動的に修正されたり,エラーを表示してしまうことがあります。分業の進んだWebアプリケーション開発においては,この問題は見過ごせません。

それでもformTagメソッドを使った方がメリットが大きいと判断されることもあるのですが,ここではとりあえず使わないことにします。

著者プロフィール

秋田真宏(あきたまさひろ)

株式会社ロケットスタート エンジニア。個人ブログは「akiyan.com」。1981年生まれ。

URLhttp://www.akiyan.com/

著書

コメント

  • Re:

    CakePHPでDBへデータ送信すると空になるのはなぜ?
    http://ap.atmarkit.co.jp/bbs/core/fcoding/19920


    参考しているCakePHPのサンプルはバージョンが1.1以前のものですので、フォームの書き方が違っているはずです。
    <?php echo $html->input('Task/content', array('size' => '40')) ?> の部分を
    <?php echo $html->input('Task.content', array('size' => '40')) ?> に変えてみてください。

    Commented : #4  おれ (2011/05/12, 01:53)

  • DBにタスクの内容が登録されない人へ

    CakePHP1.2以降で試してる方用

    <?php echo $html->input('Task/content') ?>
    は1.1用の書き方なので
    <?php echo $form->input('Task.content') ?>
    でcontentのデータも正常に受け渡されます。

    ↓の自分の書き込みはhtmlとformの訂正しか書き込んでないので、
    合わせて引数の中の書き方にご注意ください。

    Commented : #3  egaku (2010/02/17, 10:26)

  • インプットやサブミットのヘルパーがないよーってワーニンが出た人へ

    http://blog.livedoor.jp/sevastyan_tea/archives/51185568.html

    上記サイトを参考に

    <?php echo $html->input('Task/content') ?>
    <?php echo $html->submit('タスクを追加') ?>

    を以下のように書き換えで動きます。

    <?php echo $form->input('Task/content') ?>
    <?php echo $form->end('タスクを追加') ?>

    Commented : #2  egaku (2010/02/16, 10:59)

  • formにmethod="post"を入れないと動かないです

    version 1.1.18.5850を使っていますが
    <form action="<?php echo h($html->url('/tasks/add')) ?>" style="margin-bottom:1em">の指定ではgetになり
    $this->dataは常にNULLです

    Commented : #1  がう (2007/11/17, 22:23)

コメントの記入